一、参考微信公众号开发文档 网页授权 | 微信开放文档
大概可参考案例微信公众平台-测试号网页授权-获取openid方法_微信开放平台测试号-CSDN博客
二、微信公众号端开发
第一步:用户同意授权,获取code
在确保微信公众账号拥有授权作用域(scope参数)的权限的前提下(已认证服务号,默认拥有scope参数中的snsapi_base和snsapi_userinfo 权限),引导关注者打开如下页面:
scope为snsapi_userinfo:
https://open.weixin.qq.com/connect/oauth2/authorize?appid=微信测试号APPID&redirect_uri=外网可访问的自建项目接口&response_type=code&scope=snsapi_userinfo&state=STATE#wechat_redirect
scope为snsapi_base:
https://open.weixin.qq.com/connect/oauth2/authorize?appid=微信测试号APPID\&redirect_uri=外网可访问的自建项目接口\&response_type=code\&scope=snsapi_base\&state=123#wechat_redirect
第二步:通过code换取网页授权access_token
首先请注意,这里通过code换取的是一个特殊的网页授权access_token,与基础支持中的access_token(该access_token用于调用其他接口)不同。公众号可通过下述接口来获取网页授权access_token。如果网页授权的作用域为snsapi_base,则本步骤中获取到网页授权access_token的同时,也获取到了openid,snsapi_base式的网页授权流程即到此为止。
尤其注意:由于公众号的secret和获取到的access_token安全级别都非常高,必须只保存在服务器,不允许传给客户端。后续刷新access_token、通过access_token获取用户信息等步骤,也必须从服务器发起。
获取code后,请求以下链接获取access_token:
https://api.weixin.qq.com/sns/oauth2/access_token?appid=微信测试号APPID\&secret=微信测试号SECRET\&code=第一步链接获取到的code值\&grant_type=authorization_code
第二步:正确时返回的JSON数据包如下:
{
"access_token":"ACCESS_TOKEN",
"expires_in":7200,
"refresh_token":"REFRESH_TOKEN",
"openid":"OPENID",
"scope":"SCOPE",
"is_snapshotuser": 1,
"unionid": "UNIONID"
}
第三步:刷新access_token,此部分每次扫码都进行获取所以不需要,如果觉得麻烦也可以将access_token放入redis缓存定义过期时间内进行获取。
第四步:拉取用户信息(需scope为 snsapi_userinfo)
如果网页授权作用域为snsapi_userinfo,则此时开发者可以通过access_token和openid拉取用户信息了。
请求方法
第四步:正确时返回的JSON数据包如下:
{
"openid": "OPENID",
"nickname": NICKNAME,
"sex": 1,
"province":"PROVINCE",
"city":"CITY",
"country":"COUNTRY",
"headimgurl":"https://thirdwx.qlogo.cn/mmopen/g3MonUZtNHkdmzicIlibx6iaFqAc56vxLSUfpb6n5WKSYVY0ChQKkiaJSgQ1dZuTOgvLLrhJbERQQ4eMsv84eavHiaiceqxibJxCfHe/46",
"privilege":[ "PRIVILEGE1" "PRIVILEGE2" ],
"unionid": "o6_bmasdasdsad6_2sgVt7hMZOPfL"
}
三、自建项目:前端二维码生成,后端接口进行登录验证授权