oAuth2授权协议 & 微信授权登陆和绑定 & 多环境共用一个微信开发平台回调设置
OAuth2(open Auth)开放授权协议
授权码模式流程：
1、浏览器（客户端）点击一个比如使用微信登陆按钮
2、会跳到认证服务器页面，让用户选择是否授权
3、如果用户点击授权，那么会跳转到开始在链接上填写的回调地址 (redirect_uri),同时会产生一个授权码code
4、客户端又拿这个code去认证服务器请求access_token
5、有了access_token就可以去调用授权的接口，access_token有效期比较短，当access_token过期后可以refresh_token刷新access_token
微信登陆流程：
为了便于调试，可以在微信开发平台的回调上写本地服务比如egg启动的地址localhost:7001,只要和本地设置的回调地址同域名就可以生成二维码
1、引用http://res.wx.qq.com/connect/zh_CN/htmledition/js/wxLogin.js
2、 实例化以下对象可以生成一个二维码
var obj = new WxLogin({
self_redirect:false, //是在iframe里跳转还是顶层窗口跳转
id:"login_container", //DOM容器放置二维码的区域
appid: "", //在应用开发平台申请
scope: "snsapi_login", //如果是网页应用填写这个
redirect_uri: "localhost:7001/reqAccessToken",//回调地址
state: "xxx",//附带传递的数据
style: "", //二维码行内样式
href: "" //外链样式
});
3、扫描这个二维码，会弹出授权页，点击授权会重定向到刚才的回调地址redirect_uri，并会自动附上code值,如果开始填了state值，这个时候也会返回刚才的state,可以用这个state的自定义值进行区分做登陆还是绑定
redirect_uri?code=CODE&state=STATE //点击授权的返回
redirect_uri?state=STATE //不授权的返回
4、然后在比如nodejs服务路由里拦截刚才的redirect_uri地址，然后获取这个code值，去调用获取access_token的接口
https://api.weixin.qq.com/sns/oauth2/access_token?appid=APPID&secret=SECRET&code=CODE&grant_type=authorization_code
//appid和secret //开放平台提供的值，填上即可
//CODE 即上一步返回的code值
5、这个获取access_token的接口返回的数据
{
"access_token":"ACCESS_TOKEN", //调用进一步接口令牌
"expires_in":7200, //这个接口的过期时间
"refresh_token":"REFRESH_TOKEN",//刷新上面令牌的参数
"openid":"OPENID", //用户唯一标识
"scope":"SCOPE"
}
6、用openid和access_token获取用户基本信息
https://api.weixin.qq.com/sns/userinfo?access_token=ACCESS_TOKEN&openid=OPENID
//上一步返回的openid和access_token
{
"openid":"OPENID",
"nickname":"NICKNAME",
"sex":1,
"province":"PROVINCE",
"city":"CITY",
"country":"COUNTRY",
"headimgurl": "http://wx.qlogo.cn/mmopen/g3MonUZtNHkdmzicIlibx6iaFqAc56vxLSUfpb6n5WKSYVY0ChQKkiaJSgQ1dZuTOgvLLrhJbERQQ4eMsv84eavHiaiceqxibJxCfHe/0",
"privilege":[
"PRIVILEGE1",
"PRIVILEGE2"
],
"unionid": " o6_bmasdasdsad6_2sgVt7hMZOPfL" //用这个unionid进行绑定其他信息
}
7、拿unionid和用户填写的其他信息进行关联绑定，比如手机号，当用户下次绑定的时候，发现数据库里有了该手机号,则直接给用户跳转到扫码界面进行扫码登陆，如果当用户下次是直接扫码登陆，但是数据库里没有这个unionid,则给用户跳转到绑定界面让用户进行绑定
调试或多环境共用一个开发平台回调设置：
如果微信开发平台只注册了一个网站应用，只能填写一个回调地址，为了不影响本地开发调试，可以在服务端做一个转发：
比如回调地址是111.111.111.111:7001则给开发环境和生产环境加一个标识，当回调请求111.111.111.111:7001/env/dev/reqAccessToken 则重定向到 localhost:7001/reqAccessToken,如果111.111.111.111:7001/production/reqAccessToken则重定向到111.111.111.111:7001/reqAccessToken即可，本地生成二维码的redirect_uri就写111.111.111.111:7001/env/${env}即可,然后服务端路由拦截/env/:env,根据env做重定向判断。
//生成二维码的实例化对象redirect_uri填写
//跟微信开发平台填写的回调地址同域名
var redirectPrefix = "https://www.xxx.com";
var CURENV = '<%=env%>';
new WxLogin({
self_redirect: false,
id: "J_wechatCodeBind",
appid: "xxx",
scope: "snsapi_login",
redirect_uri: encodeURI(`${redirectPrefix}/env/${CURENV}`),
state:"",
style: "white",
href: ""
});
//路由拦截上面的回调GET请求
async redirectUrl() {
const ctx = this.ctx;
const curEnv = ctx.params.curEnv;
const code = ctx.query.code;
const state = ctx.query.state;
if (curEnv == 'dev') {
ctx.redirect(`http://localhost:7001/xxx/xxx/requestAccessToken?code=${code}&state=${state}`);
} else if (curEnv == 'test') {
ctx.redirect(`http://192.168.0.xxx:7006/xxx/xxx/requestAccessToken?code=${code}&state=${state}`);
} else {
ctx.redirect(`https://www.xxx.com/xxx/xxx/requestAccessToken?code=${code}&state=${state}`);
}
}
