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認證就完成了。