上一篇:获取access_token+自定义菜单
这部分代码是以前就已经完成了,可是考虑篇幅的问题就和上篇分开了,这部分相较前面的方式较为复杂一点,可是也是很容易理解的。
这里简单介绍一下微信网页受权。html
注:下面引自官方文档
一、在微信公众号请求用户网页受权以前,开发者须要先到公众平台官网中的“开发 - 接口权限 - 网页服务 - 网页账号 - 网页受权获取用户基本信息”的配置选项中,修改受权回调域名。请注意,这里填写的是域名(是一个字符串),而不是URL,所以请勿加 http:// 等协议头;
二、受权回调域名配置规范为全域名,好比须要网页受权的域名为:www.qq.com,配置之后此域名下面的页面http://www.qq.com/music.html 、 http://www.qq.com/login.html 均可以进行OAuth2.0鉴权。但http://pay.qq.com 、 http://music.qq.com 、 http://qq.com没法进行OAuth2.0鉴权。
好比:须要受权的网页域名为http://xiadd.weixin.qq.com/demo,那么须要配置回调域名为xiadd.weixin.qq.com。其余域名同理。配置图示以下:
在权限里找到这部分,点击修改。
将回调域名改成本身须要的域名:
这样回调域名就修改为功了。git
关于受权登陆的各类参数细节这里就很少说了,可是这里也有一个access_token须要注意一下,和全局缓存的那个注意不要搞混了(话说tx为啥不作一下命名区分)。这里的access_token是oauth的一个凭证,全局缓存的那个是调用微信公众平台各个基础接口所要用到的凭证。
具体而言,网页受权流程分为四步:
一、引导用户进入受权页面赞成受权,获取code
二、经过code换取网页受权access_token(与基础支持中的access_token不一样)
三、若是须要,开发者能够刷新网页受权access_token,避免过时
四、经过网页受权access_token和openid获取用户基本信息
这里的第三步不是必须的,这里先不提,也就是受权登陆主要是三部分。引导用户点击相应连接获取code,code换区access_token,经过access_token去的相应信息。github
由于受权登陆的权限较高,因此微信平台会对连接的顺序进行校验,顺序是固定的。连接格式以下:https://open.weixin.qq.com/connect/oauth2/authorize?appid=APPID&redirect_uri=REDIRECT_URI&response_type=code&scope=SCOPE&state=STATE#wechat_redirect
segmentfault
其中appid是固定的,就是公众号的appid。redirect_uri
就是受权成功后须要跳转到的连接。response_type
是固定的就是code。
scope就是受权权限,主要有两种:snsapi_base (不弹出受权页面,直接跳转,只能获取用户openid),snsapi_userinfo (弹出受权页面,可经过openid拿到昵称、性别、所在地。而且,即便在未关注的状况下,只要用户受权,也能获取其信息)。api
这里的scope以snsapi_userinfo为例,获取用户的信息。点进连接进入到受权页面。如图:浏览器
受权后获得url形式以下。code就包含在url里:缓存
这样code就获得了。code只能使用一次,5分钟未被使用自动过时。安全
再次提醒,这里的access_token和全局缓存的access_token是不同的。具体返回参数请看文档,这里不一一列出了。
获得code后,经过get请求https://api.weixin.qq.com/sns/oauth2/access_token?appid=APPID&secret=SECRET&code=CODE&grant_type=authorization_code
,参数分别为appid,appsecret,和前一步获取的code,虽然这里能够经过浏览器进行请求,可是由于安全级别高,因此千万在服务端进行请求。代码以下:微信
//getWebToken.js function getToken(code) { let reqUrl = 'https://api.weixin.qq.com/sns/oauth2/access_token?'; let params = { appid: config.appId, secret: config.appSecret, code: code, grant_type: 'authorization_code' }; let options = { method: 'get', url: reqUrl+qs.stringify(params) }; console.log(options.url); return new Promise((resolve, reject) => { request(options, function (err, res, body) { if (res) { resolve(body); } else { reject(err); } }) }) }
就是很简单的一个请求获得想要的数据。可是注意获得的数据是个字符串,须要进行处理,响应格式以下:app
对于scope为snsapi_base的受权,这里是最后一步,会返回openid。若是须要再进行下一步。
若是网页受权做用域为snsapi_userinfo,则此时开发者能够经过access_token和openid拉取用户信息了。
请求方法
http:GET(请使用https协议) https://api.weixin.qq.com/sns/userinfo?access_token=ACCESS_TOKEN&openid=OPENID&lang=zh_CN
这里也很简单。直接看代码:
function getUserInfo(AccessToken, openId) { let reqUrl = 'https://api.weixin.qq.com/sns/userinfo?'; let params = { access_token: AccessToken, openid: openId, lang: 'zh_CN' }; let options = { method: 'get', url: reqUrl+qs.stringify(params) }; return new Promise((resolve, reject) => { request(options, function (err, res, body) { if (res) { resolve(body); } else { reject(err); } }); }) }
具体响应到网页上如图所示:
这样就经过受权登陆拉取到了用户信息。
github地址奉上:https://github.com/xiadd/shorthand 欢迎star?