1.配置授權回調頁面域名
在高級接口權限列表中，找到「OAuth2.0網頁授權」，點擊右側的「修改」，如圖7-2所示。
圖7-2 微信OAuth2.0授權
授權回調頁面域名配置規範為全域名並且不帶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鑒權。
這裡填寫mascot.duapp.com，它是方倍工作室的一個百度應用二級域名，如圖7-3所示。
圖7-3 配置授權回調頁面域名
正常情況下，頂部會提示「通過安全監測」，表示提交通過。
2.用戶授權並獲取code
在域名根目錄下新建一個文件，命名為oauth2.php，其內容如下。
<?php
if (isset($_GET['code'])){
echo$_GET['code'];
}else{
echo "NO CODE";
}
?>
先瞭解請求授權頁面的構造方式，接口請求如下。
https:// open.weixin.qq.com/connect/oauth2/authorize?appid=APPID&redirect_uri=REDI RECT_URI&response_type=code&scope=SCOPE&state=STATE#wechat_redirect
請求授權的參數說明如表7-1所示。
表7-1 授權請求的參數說明
構造請求接口如下。
1）scope為snsapi_userinfo（本節基於這個實現）時。
https:// open.weixin.qq.com/connect/oauth2/authorize?appid=wx9a000b615d89c3f1&redi rect_uri=http:// mascot.duapp.com/oauth2.php&response_type=code&scope=snsapi_user info&state=1#wechat_redirect
2）scope為snsapi_base時。
https:// open.weixin.qq.com/connect/oauth2/authorize?appid=wx9a000b615d89c3f1&redi rect_uri=http:// mascot.duapp.com/oauth2.php&response_type=code&scope=snsapi_base& state=2#wechat_redirect
把這個鏈接發送或者回復到用戶微信中，以便在微信瀏覽器中打開，這裡使用a標籤封裝如下。
OAuth2.0網頁授權演示 <a href="https:// open.weixin.qq.com/connect/oauth2/authorize?appid=wx9a000b615d89 c3f1&redirect_uri=http:// mascot.duapp.com/oauth2.php&response_type=code&scope= snsapi_userinfo&state=1#wechat_redirect">點擊這裡體驗</a> 技術支持 方倍工作室
在微信中顯示的效果如圖7-4所示。
點擊「點擊這裡體驗」鏈接後，彈出應用授權界面，如圖7-5所示。
點擊「確認登錄」按鈕，將跳轉到oauth2.php頁面，程序將獲取到code，界面顯示效果如圖7-6所示。
圖7-4 體驗OAuth2.0授權
圖7-5 應用登錄
圖7-6 獲取code
這時可以通過右上角按鈕下的複製鏈接，得到的鏈接如下。
http:// mascot.duapp.com/oauth2.php?code=00364c54e24d0029f8db4274dcaff638&state=1
成功得到了code。
3.使用code換取access_token
如果網頁授權的作用域為snsapi_base，則本步驟中獲取到網頁授權access_token的同時，也獲取到了OpenID，snsapi_base式的網頁授權流程即到此為止。
換取網頁授權access_token頁面的接口如下。
https:// api.weixin.qq.com/sns/oauth2/access_token?appid=APPID&secret=SECRET&code=CODE&grant_type=authorization_code
相關參數如表7-2所示。
表7-2 換取access_token請求的參數說明
構造請求如下。
https:// api.weixin.qq.com/sns/oauth2/access_token?appid=wx9a000b615d89c3f1&secre t=0ca77dd808ee1ea69830d7eecd770c06&code=00364c54e24d0029f8db4274dcaff638&grant_ type=authorization_code
可以在瀏覽器中直接執行這條語句，得到如下JSON數據。
{
"access_token": "OezXcEiiBSKSxW0eoylIeBxt9UjhFtdKikeq2gavEwzx1JhikLTyOhNThJV4l-
qYxDZzhc7tEq4_4aNdgf12gPPO6-byBWFPPW0hS-_ElI7J3Pg7-gr4RqmBrY3fU1OOaJfd3tD7iU
6qnGXX5f9UGA",
"expires_in": 7200,
"refresh_token": "OezXcEiiBSKSxW0eoylIeBxt9UjhFtdKikeq2gavEwzx1JhikLTyOhNThJV4l-
qYxDZzhc7tEq4_4aNdgf12gNrlgJdOP1s3jqw49fpv-KQjni32A-DwXprScuG8_J2gJLqcT6WXH-
fSFDr_Uk3NtA",
"openid": "o7Lp5t6n59DeX3U0C7Kric9qEx-Q",
"scope": "snsapi_userinfo,"
}
數據格式解讀如表7-3所示。
表7-3 換取access_token結果的參數說明
於是，成功通過code換取到了access_token及refresh_token。
4.刷新access_token（如果需要）
官方文檔中提到了刷新access_token的功能，但這不是必須要做的，初次學習可以先忽略。
由於access_token擁有較短的有效期，當access_token超時後，可以使用refresh_token刷新。refresh_token擁有較長的有效期（7天、30天、60天、90天），當refresh_token失效後，需要用戶重新授權。
獲取上一步的refresh_token後，請求以下鏈接獲取access_token。
https:// api.weixin.qq.com/sns/oauth2/refresh_token?appid=APPID&grant_type=refresh_token&refresh_token=REFRESH_TOKEN
該接口的參數說明如表7-4所示。
表7-4 刷新access_token請求的參數說明
這裡構造如下URL。
https:// api.weixin.qq.com/sns/oauth2/refresh_token?appid=wx9a000b615d89c3f1&grant_type=refresh_token&refresh_token=OezXcEiiBSKSxW0eoylIeBxt9UjhFtdKikeq2gavEwzx1JhikLTyOhNThJV4l-qYxDZzhc7tEq4_4aNdgf12gNrlgJdOP1s3jqw49fpv-KQjni32A-DwXprScuG8_J2gJLqcT6WXH-fSFDr_Uk3NtA
在瀏覽器中執行，可以得到與前面同樣格式的JSON數據。
5.使用access_token獲取用戶信息（scope為snsapi_userinfo時）
請求接口如下。
https:// api.weixin.qq.com/sns/userinfo?access_token=ACCESS_TOKEN&openid=OPENID
該接口的參數說明如表7-5所示。
表7-5 獲取用戶信息請求的參數說明
構造請求如下。
https:// api.weixin.qq.com/sns/userinfo?access_token=OezXcEiiBSKSxW0eoylIeBxt9UjhF tdKikeq2gavEwzx1JhikLTyOhNThJV4l-qYxDZzhc7tEq4_4aNdgf12gPPO6-byBWFPPW0hS-_ElI7 J3Pg7-gr4RqmBrY3fU1OOaJfd3tD7iU6qnGXX5f9UGA&openid=o7Lp5t6n59DeX3U0C7Kric9qEx-Q
執行上述接口後，得到如下數據。
{
"openid":"o7Lp5t6n59DeX3U0C7Kric9qEx-Q",
"nickname":"FangBei",
"sex":1,
"language":"zh_CN",
"city":"深圳",
"province":"廣東",
"country":"中國",
"headimgurl":"http:// wx.qlogo.cn/mmopen/Kkv3HV30gbEZmoo1rTrP4UjRRqzsibUjT9JClP
Jy3gzo0NkEqzQ9yTSJzErnsRqoLIct5NdLJgcDMicTEBiaibzLn34JLwficVvl6/0",
"privilege":
}
上述參數解讀如表7-6所示。
表7-6 獲取用戶信息結果的參數說明
這與作者的個人微信是一致的，如圖7-7所示。
圖7-7 個人信息
至此，在不輸入賬號及密碼的情況下，微信公眾號獲得了用戶的個人信息，包括暱稱、性別、國家、省份、城市、個人頭像及特權列表。
一個完整的OAuth2.0認證就完成了。