如果用户在微信客户端中访问第三方网页,公众号可以通过微信网页授权机制,来获取用户基本信息,进而实现业务逻辑。
名词解释
网页授权回调域名
开发者需要先到公众平台官网中的“开发 - 接口权限 - 网页服务 - 网页帐号 - 网页授权获取用户基本信息”的配置选项中,修改授权回调域名。请注意,这里填写的域名不用加 http:// 等协议头。
两种 scope 授权方式
scope 的值可以为snsapi_base和snsapi_userinfo 。
snsapi_base 授权
用途:获取进入页面的用户的 openid 采用静默授权的方式,无需用户同意,自动跳转到回调地址。
snsapi_base 授权
用途:获取进入页面的用户的 openid 和用户的基本信息,采用弹框授权的方式,需要用户同意,同意后跳转到回调地址。
access_token
微信网页授权是通过OAuth2.0机制实现的,在用户授权给公众号后,公众号可以获取到一个网页授权特有的接口调用凭证(网页授权access_token),通过网页授权access_token可以进行授权后接口调用,如获取用户基本信息。
授权流程,前端仅为两步
第一步:用户同意授权,获取code
第二步:通过code换取网页授权access_token
第一步:获取code
构造请求地址,附上参数:
| 参数 | 是否必须 | 说明 |
|---|---|---|
| appid | 是 | 公众号的唯一标识 |
| redirect_uri | 是 | 授权后重定向的回调链接地址, 请使用 urlEncode对链接进行处理 |
| response_type | 是 | 返回类型,请填写code |
| scope | 是 | 应用授权作用域,snsapi_base(不弹出授权页面,直接跳转,只能获取用户openid),snsapi_userinfo(弹出授权页面,可通过openid拿到昵称、性别、所在地。并且, 即使在未关注的情况下,只要用户授权,也能获取其信息 ) |
| state | 否 | 重定向后会带上state参数,开发者可以填写a-zA-Z0-9的参数值,最多128字节 |
| #wechat_redirect | 是 | 无论直接打开还是做页面302重定向时候,必须带此参数 |
第二步:用户同意授权后
如果用户同意授权,页面将跳转至 redirect_uri/?code=CODE&state=STATE。
code说明 : code作为换取access_token的票据,每次用户授权带上的code将不一样,code只能使用一次,5分钟未被使用自动过期。
关于回调地址的坑
请注意在第一步中设置的回调地址参数,需要带上http协议头,并且严格区分HTTP和HTTPS,授权后将会跳转到你设置的回调地址,如果服务端配置了强制HTTPS访问,而授权时的回调地址为HTTP,那么会导致本地缓存的数据因为不同源导致的丢失。
关于授权条件
如果在非微信中访问并调用授权,就出现“请在微信中访问的”提示,在有些特殊情况或者本地调试中,可以加个判断,只有当在微信中访问,才调用授权逻辑,本地调试建议使用官方的微信开发者工具。
var is_weixin = (function () {
return navigator.userAgent.toLowerCase().indexOf("micromessenger") !== -1
})();