上一篇：擷取access_token+自定義菜單
這部分代碼是之前就已經完成了，但是考慮篇幅的問題就和上篇分開了，這部分相較前面的方式較為複雜一點，但是也是很容易了解的。
這裡簡單介紹一下微信網頁授權。
微信網頁授權
配置回調域名：
注：下面引自官方文檔
1、在微信公衆号請求使用者網頁授權之前，開發者需要先到公衆平台官網中的“開發 - 接口權限 - 網頁服務 - 網頁帳号 - 網頁授權擷取使用者基本資訊”的配置選項中，修改授權回調域名。請注意，這裡填寫的是域名（是一個字元串），而不是URL，是以請勿加 http:// 等協定頭；
2、授權回調域名配置規範為全域名，比如需要網頁授權的域名為：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。其他域名同理。配置圖示如下：
在權限裡找到這部分，點選修改。
将回調域名改為自己需要的域名：
這樣回調域名就修改成功了。
授權登入
關于授權登入的各種參數細節這裡就不多說了，但是這裡也有一個access_token需要注意一下，和全局緩存的那個注意不要搞混了（話說tx為啥不做一下命名區分）。這裡的access_token是oauth的一個憑證，全局緩存的那個是調用微信公衆平台各個基礎接口所要用到的憑證。
具體而言，網頁授權流程分為四步：
1、引導使用者進入授權頁面同意授權，擷取code
2、通過code換取網頁授權access_token（與基礎支援中的access_token不同）
3、如果需要，開發者可以重新整理網頁授權access_token，避免過期
4、通過網頁授權access_token和openid擷取使用者基本資訊
這裡的第三步不是必須的，這裡先不提，也就是授權登入主要是三部分。引導使用者點選相應連結擷取code，code換區access_token，通過access_token去的相應資訊。
引導使用者擷取code
因為授權登入的權限較高，是以微信平台會對連結的順序進行校驗，順序是固定的。連結格式如下：
https://open.weixin.qq.com/connect/oauth2/authorize?appid=APPID&redirect_uri=REDIRECT_URI&response_type=code&scope=SCOPE&state=STATE#wechat_redirect
其中appid是固定的，就是公衆号的appid。
redirect_uri
就是授權成功後需要跳轉到的連結。
response_type
是固定的就是code。
scope就是授權權限，主要有兩種：snsapi_base （不彈出授權頁面，直接跳轉，隻能擷取使用者openid），snsapi_userinfo （彈出授權頁面，可通過openid拿到昵稱、性别、所在地。并且，即使在未關注的情況下，隻要使用者授權，也能擷取其資訊）。
這裡的scope以snsapi_userinfo為例，擷取使用者的資訊。點進連結進入到授權頁面。如圖：
授權後得到url形式如下。code就包含在url裡：
這樣code就得到了。code隻能使用一次，5分鐘未被使用自動過期。
通過code換取網頁授權access_token
再次提醒，這裡的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);
}
})
})
}
就是很簡單的一個請求得到想要的資料。但是注意得到的資料是個字元串，需要進行處理，響應格式如下：
對于scope為snsapi_base的授權，這裡是最後一步，會傳回openid。如果需要再進行下一步。
拉取使用者資訊
如果網頁授權作用域為snsapi_userinfo，則此時開發者可以通過access_token和openid拉取使用者資訊了。
請求方法
http：GET（請使用https協定） 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?