微信网络授权－获取openId及用户信息

最新推荐文章于 2025-06-21 23:29:41 发布

原创最新推荐文章于 2025-06-21 23:29:41 发布 · 772 阅读

2 ·

CC 4.0 BY-SA版权

文章标签：

#微信网络授权 #H5 #微信用户信息 #移动端

H5 专栏收录该内容

2 篇文章

订阅专栏

使用场景：

网页获取当前微信用户的头像和昵称(无需关注公众号) 微信公众平台API

网页授权流程：

用户同意授权，获取code
通过code换取网页授权access_token及openid
根据access_token和openid，拉取用户信息(需scope为snsapi_userinfo)

基本概念：

静默授权：以snsapi_base为scope发起的网页授权，是用来获取进入页面的用户的openid的，并且是静默授权并自动跳转到回调页的。用户感知的就是直接进入了回调页（往往是业务页面）

非静默授权：以snsapi_userinfo为scope发起的网页授权，是用来获取用户的基本信息的。但这种授权需要用户手动同意，并且由于用户同意过，所以无须关注，就可在授权后获取该用户的基本信息。

授权回调地址：授权回调域名需要在公众平台中配置[“开发 - 接口权限 - 网页服务 - 网页帐号 - 网页授权获取用户基本信息”]，配置规范为全域名，比如需要网页授权的域名为：www.aaa.com，该域下的网页如www.aaa.com/index.html均可进行鉴权。

openid: 用户唯一标识，请注意，在未关注公众号时，用户访问公众号的网页，也会产生一个用户和公众号唯一的OpenID。

具体实现：

第一步：用户同意授权，获取code

判断url中的code，若无code则采用以下方式跳转，当用户同意授权，页面将跳转至readirect_url/?code=CODE&state=STATE。

let data = {
    appid: 'xxx',
    redirect_uri: 'http://xxx.com'
};

window.loaction.href =     
	`https://open.weixin.qq.com/connect/oauth2/authorize?` +
	`appid=${data.appid}&` +
	`redirect_uri=${data.redirect_uri}&` +
	`response_type=code&` +
	`scope=snsapi_userinfo&` +
	`state=STATE#wechat_redirect`;

参数说明及错误返回码详见官方文档

第二步：通过code获取access_token及openid

公众号的secret和获取到的access_token安全级别都非常高，必须只保存在服务器。获取URL上的code值，发起请求将code值传于服务端，由服务端发起以下请求获取access_token。

https://api.weixin.qq.com/sns/oauth2/access_token?
appid=APPID&secret=SECRET&code=CODE&grant_type=authorization_code

注意：后续刷新access_token、通过access_token获取用户信息等步骤，也必须从服务器发起。

第三步：拉取用户信息(需scope为snsapi_userinfo)

通过第二步获取到的access_token和openid，请求获取用户信息

https://api.weixin.qq.com/sns/userinfo?
access_token=ACCESS_TOKEN&openid=OPENID&lang=zh_CN

注意：需由服务端发起

正确时返回的json数据格式如下：

{
  "openid": "",  // openid
  "nickname": "",  // 昵称
  "sex": "",  // 1:男性，2:女性，0：未知
  "province": "",  // 省份
  "city": "",  // 城市
  "country": "",  // 国家
  "headimgurl": "http://thirdwx.qlogo.cn/mmopen/...",  // 头像
  "privilege": [],  // 特权
  "unionid": ""  //只有在用户将公众号绑定到微信开放平台帐号后，才会出现该字段
}

错误返回：

{"errcode":40003,"errmsg":" invalid openid "}

参考：

微信网页授权