微信網(wǎng)頁 第三方登錄原理詳解
微信開放平臺和公眾平臺的區(qū)別
1.公眾平臺面向的時普通的用戶,比如自媒體和媒體,企業(yè)官方微信公眾賬號運營人員使用,當然你所在的團隊或者公司有實力去開發(fā)一些內(nèi)容,也可以調(diào)用公眾平臺里面的接口,比如自定義菜單,自動回復,查詢功能。目前大多數(shù)微信通過認證之后,都在做這個事情。
2.開放平臺面向的開發(fā)者和第三方獨立軟件開發(fā)商。我覺得開發(fā)平臺最大的開放就是微信登錄。當年騰訊沒有花大力氣去做統(tǒng)一登錄這個事情,導致目前各個網(wǎng)站都要弄一套登錄機制。好在他們現(xiàn)在認清了局勢。開發(fā)者或軟件開發(fā)商,通過微信開放提供的平臺和接口,可以開發(fā)適合企業(yè)的電子商務網(wǎng)站,掃描二維碼進去一個游戲界面,然后去購買商品等。當然后續(xù)開放平臺要開放支付接口,那么類似口袋通這種軟件開發(fā)廠商,就可以為大型,中小企業(yè)提供微信小店這種服務和軟件了。
公眾平臺就是服務號訂閱號的管理開發(fā)后臺。
開發(fā)平臺說得通俗一點就是實現(xiàn)手機里邊安裝軟件的內(nèi)容一鍵分享朋友圈;
下面的第三方登陸就是依托于開放平臺(open.weixin.qq.com)的功能
準備工作
網(wǎng)站應用微信登錄是基于OAuth2.0協(xié)議標準構建的微信OAuth2.0授權登錄系統(tǒng)。
在進行微信OAuth2.在進行微信OAuth2.0授權登錄接入之前,在微信開放平臺注冊開發(fā)者帳號,并擁有一個已審核通過的網(wǎng)站應用,并獲得相應的AppID和AppSecret,申請微信登錄且通過審核后,可開始接入流程。
授權流程說明
微信OAuth2.0授權登錄讓微信用戶使用微信身份安全登錄第三方應用或網(wǎng)站,在微信用戶授權登錄已接入微信OAuth2.0的第三方應用后,第三方可以獲取到用戶的接口調(diào)用憑證(access_token),通過access_token可以進行微信開放平臺授權關系接口調(diào)用,從而可實現(xiàn)獲取微信用戶基本開放信息和幫助用戶實現(xiàn)基礎開放功能等。
微信OAuth2.0授權登錄目前支持authorization_code模式,適用于擁有server端的應用授權。該模式整體流程為:
1. 第三方發(fā)起微信授權登錄請求,微信用戶允許授權第三方應用后,微信會拉起應用或重定向到第三方網(wǎng)站,并且?guī)鲜跈嗯R時票據(jù)code參數(shù);
2. 通過code參數(shù)加上AppID和AppSecret等,通過API換取access_token;
3. 通過access_token進行接口調(diào)用,獲取用戶基本數(shù)據(jù)資源或幫助用戶實現(xiàn)基本操作。
獲取access_token時序圖:
第一步:請求CODE
第三方使用網(wǎng)站應用授權登錄前請注意已獲取相應網(wǎng)頁授權作用域(scope=snsapi_login),則可以通過在PC端打開以下鏈接:
若提示“該鏈接無法訪問”,請檢查參數(shù)是否填寫錯誤,如redirect_uri的域名與審核時填寫的授權域名不一致或scope不為snsapi_login。
參數(shù)說明
參數(shù) | 是否必須 | 說明 |
---|---|---|
appid | 是 | 應用唯一標識 |
redirect_uri | 是 | 重定向地址,需要進行UrlEncode |
response_type | 是 | 填code |
scope | 是 | 應用授權作用域,擁有多個作用域用逗號(,)分隔,網(wǎng)頁應用目前僅填寫snsapi_login即可 |
state | 否 | 用于保持請求和回調(diào)的狀態(tài),授權請求后原樣帶回給第三方。該參數(shù)可用于防止csrf攻擊(跨站請求偽造攻擊),建議第三方帶上該參數(shù),可設置為簡單的隨機數(shù)加session進行校驗 |
返回說明
用戶允許授權后,將會重定向到redirect_uri的網(wǎng)址上,并且?guī)蟘ode和state參數(shù)
redirect_uri?code=CODE&state=STATE
若用戶禁止授權,則重定向后不會帶上code參數(shù),僅會帶上state參數(shù)
redirect_uri?state=STATE
請求示例
登錄一號店網(wǎng)站應用
https://passport.yhd.com/wechat/login.do
打開后,一號店會生成state參數(shù),跳轉(zhuǎn)到
https://open.weixin.qq.com/connect/qrconnect?appid=wxbdc5610cc59c1631&redirect_uri=https%3A%2F%2Fpassport.yhd.com%2Fwechat%2Fcallback.do&response_type=code&scope=snsapi_login&state=3d6be0a4035d839573b04816624a415e#wechat_redirect
微信用戶使用微信掃描二維碼并且確認登錄后,PC端會跳轉(zhuǎn)到
https://passport.yhd.com/wechat/callback.do?code=CODE&state=3d6be0a4035d839573b04816624a415e
為了滿足網(wǎng)站更定制化的需求,我們還提供了第二種獲取code的方式,支持網(wǎng)站將微信登錄二維碼內(nèi)嵌到自己頁面中,用戶使用微信掃碼授權后通過JS將code返回給網(wǎng)站。
JS微信登錄主要用途:網(wǎng)站希望用戶在網(wǎng)站內(nèi)就能完成登錄,無需跳轉(zhuǎn)到微信域下登錄后再返回,提升微信登錄的流暢性與成功率。 網(wǎng)站內(nèi)嵌二維碼微信登錄JS實現(xiàn)辦法:
步驟1:在頁面中先引入如下JS文件(支持https):
<script src="http://res.wx.qq.com/connect/zh_CN/htmledition/js/wxLogin.js"></script>
步驟2:在需要使用微信登錄的地方實例以下JS對象:
var obj = new WxLogin({
id:"login_container",
appid: "",
scope: "",
redirect_uri: "",
state: "",
style: "",
href: ""
});
參數(shù)說明
參數(shù) | 是否必須 | 說明 |
---|---|---|
id | 是 | 第三方頁面顯示二維碼的容器id |
appid | 是 | 應用唯一標識,在微信開放平臺提交應用審核通過后獲得 |
scope | 是 | 應用授權作用域,擁有多個作用域用逗號(,)分隔,網(wǎng)頁應用目前僅填寫snsapi_login即可 |
redirect_uri | 是 | 重定向地址,需要進行UrlEncode |
state | 否 | 用于保持請求和回調(diào)的狀態(tài),授權請求后原樣帶回給第三方。該參數(shù)可用于防止csrf攻擊(跨站請求偽造攻擊),建議第三方帶上該參數(shù),可設置為簡單的隨機數(shù)加session進行校驗 |
style | 否 | 提供"black"、"white"可選,默認為黑色文字描述。詳見文檔底部FAQ |
href | 否 | 自定義樣式鏈接,第三方可根據(jù)實際需求覆蓋默認樣式。詳見文檔底部FAQ |
通過code獲取access_token
https://api.weixin.qq.com/sns/oauth2/access_token?appid=APPID&secret=SECRET&code=CODE&grant_type=authorization_code
參數(shù)說明
參數(shù) | 是否必須 | 說明 |
---|---|---|
appid | 是 | 應用唯一標識,在微信開放平臺提交應用審核通過后獲得 |
secret | 是 | 應用密鑰AppSecret,在微信開放平臺提交應用審核通過后獲得 |
code | 是 | 填寫第一步獲取的code參數(shù) |
grant_type | 是 | 填authorization_code |
返回說明
正確的返回:
{
"access_token":"ACCESS_TOKEN",
"expires_in":7200,
"refresh_token":"REFRESH_TOKEN",
"openid":"OPENID",
"scope":"SCOPE","unionid": "o6_bmasdasdsad6_2sgVt7hMZOPfL"}
參數(shù) | 說明 |
---|---|
access_token | 接口調(diào)用憑證 |
expires_in | access_token接口調(diào)用憑證超時時間,單位(秒) |
refresh_token | 用戶刷新access_token |
openid | 授權用戶唯一標識 |
scope | 用戶授權的作用域,使用逗號(,)分隔 |
unionid | 只有在用戶將公眾號綁定到微信開放平臺帳號后,才會出現(xiàn)該字段。 |
錯誤返回樣例:
{"errcode":40029,"errmsg":"invalid code"}
刷新access_token有效期
access_token是調(diào)用授權關系接口的調(diào)用憑證,由于access_token有效期(目前為2個小時)較短,當access_token超時后,可以使用refresh_token進行刷新,access_token刷新結果有兩種:
1. 若access_token已超時,那么進行refresh_token會獲取一個新的access_token,新的超時時間;
2. 若access_token未超時,那么進行refresh_token不會改變access_token,但超時時間會刷新,相當于續(xù)期access_token。
refresh_token擁有較長的有效期(30天),當refresh_token失效的后,需要用戶重新授權。
請求方法
獲取第一步的code后,請求以下鏈接進行refresh_token:
https://api.weixin.qq.com/sns/oauth2/refresh_token?appid=APPID&grant_type=refresh_token&refresh_token=REFRESH_TOKEN
參數(shù)說明
參數(shù) | 是否必須 | 說明 |
---|---|---|
appid | 是 | 應用唯一標識 |
grant_type | 是 | 填refresh_token |
refresh_token | 是 | 填寫通過access_token獲取到的refresh_token參數(shù) |
返回說明
正確的返回:
{
"access_token":"ACCESS_TOKEN",
"expires_in":7200,
"refresh_token":"REFRESH_TOKEN",
"openid":"OPENID",
"scope":"SCOPE"
}
參數(shù) | 說明 |
---|---|
access_token | 接口調(diào)用憑證 |
expires_in | access_token接口調(diào)用憑證超時時間,單位(秒) |
refresh_token | 用戶刷新access_token |
openid | 授權用戶唯一標識 |
scope | 用戶授權的作用域,使用逗號(,)分隔 |
scope 用戶授權的作用域,使用逗號(,)分隔
錯誤返回樣例:
{"errcode":40030,"errmsg":"invalid refresh_token"}
注意:
1、Appsecret 是應用接口使用密鑰,泄漏后將可能導致應用數(shù)據(jù)泄漏、應用的用戶數(shù)據(jù)泄漏等高風險后果;存儲在客戶端,極有可能被惡意竊?。ㄈ绶淳幾g獲取Appsecret);
2、access_token 為用戶授權第三方應用發(fā)起接口調(diào)用的憑證(相當于用戶登錄態(tài)),存儲在客戶端,可能出現(xiàn)惡意獲取access_token 后導致的用戶數(shù)據(jù)泄漏、用戶微信相關接口功能被惡意發(fā)起等行為;
3、refresh_token 為用戶授權第三方應用的長效憑證,僅用于刷新access_token,但泄漏后相當于access_token 泄漏,風險同上。
建議將secret、用戶數(shù)據(jù)(如access_token)放在App云端服務器,由云端中轉(zhuǎn)接口調(diào)用請求。
第三步:通過access_token調(diào)用接口
獲取access_token后,進行接口調(diào)用,有以下前提:
1. access_token有效且未超時;
2. 微信用戶已授權給第三方應用帳號相應接口作用域(scope)。
對于接口作用域(scope),能調(diào)用的接口有以下:
授權作用域(scope) | 接口 | 接口說明 |
---|---|---|
snsapi_base | /sns/oauth2/access_token | 通過code換取access_token、refresh_token和已授權scope |
/sns/oauth2/refresh_token | 刷新或續(xù)期access_token使用 | |
/sns/auth | 檢查access_token有效性 | |
snsapi_userinfo | /sns/userinfo | 獲取用戶個人信息 |
其中snsapi_base屬于基礎接口,若應用已擁有其它scope權限,則默認擁有snsapi_base的權限。使用snsapi_base可以讓移動端網(wǎng)頁授權繞過跳轉(zhuǎn)授權登錄頁請求用戶授權的動作,直接跳轉(zhuǎn)第三方網(wǎng)頁帶上授權臨時票據(jù)(code),但會使得用戶已授權作用域(scope)僅為snsapi_base,從而導致無法獲取到需要用戶授權才允許獲得的數(shù)據(jù)和基礎功能。
接口調(diào)用方法可查閱《微信授權關系接口調(diào)用指南》
F.A.Q
1. 什么是授權臨時票據(jù)(code)?
答:第三方通過code進行獲取access_token的時候需要用到,code的超時時間為10分鐘,一個code只能成功換取一次access_token即失效。code的臨時性和一次保障了微信授權登錄的安全性。第三方可通過使用https和state參數(shù),進一步加強自身授權登錄的安全性。
2. 什么是授權作用域(scope)?
答:授權作用域(scope)代表用戶授權給第三方的接口權限,第三方應用需要向微信開放平臺申請使用相應scope的權限后,使用文檔所述方式讓用戶進行授權,經(jīng)過用戶授權,獲取到相應access_token后方可對接口進行調(diào)用。
3. 網(wǎng)站內(nèi)嵌二維碼微信登錄JS代碼中style字段作用?
答:第三方頁面顏色風格可能為淺色調(diào)或者深色調(diào),若第三方頁面為淺色背景,style字段應提供"black"值(或者不提供,black為默認值),則對應的微信登錄文字樣式為黑色。相關效果如下:
若提供"white"值,則對應的文字描述將顯示為白色,適合深色背景。相關效果如下:
4.網(wǎng)站內(nèi)嵌二維碼微信登錄JS代碼中href字段作用?
答:如果第三方覺得微信團隊提供的默認樣式與自己的頁面樣式不匹配,可以自己提供樣式文件來覆蓋默認樣式。舉個例子,如第三方覺得默認二維碼過大,可以提供相關css樣式文件,并把鏈接地址填入href字段
.impowerBox .qrcode {width: 200px;} .impowerBox .title {display: none;} .impowerBox .info {width: 200px;} .status_icon {display:none} .impowerBox .status {text-align: center;}
相關效果如下:
通過code獲取access_token
接口說明
通過code獲取access_token的接口。
請求說明
http請求方式: GET
參數(shù)說明
參數(shù) | 是否必須 | 說明 |
---|---|---|
appid | 是 | 應用唯一標識,在微信開放平臺提交應用審核通過后獲得 |
secret | 是 | 應用密鑰AppSecret,在微信開放平臺提交應用審核通過后獲得 |
code | 是 | 填寫第一步獲取的code參數(shù) |
grant_type | 是 | 填authorization_code |
返回說明
正確的返回:
{
"access_token":"ACCESS_TOKEN",
"expires_in":7200,
"refresh_token":"REFRESH_TOKEN",
"openid":"OPENID",
"scope":"SCOPE"
}
參數(shù) | 說明 |
---|---|
access_token | 接口調(diào)用憑證 |
expires_in | access_token接口調(diào)用憑證超時時間,單位(秒) |
refresh_token | 用戶刷新access_token |
openid | 授權用戶唯一標識 |
scope | 用戶授權的作用域,使用逗號(,)分隔 |
錯誤返回樣例:
{
"errcode":40029,"errmsg":"invalid code"
}
刷新或續(xù)期access_token使用
接口說明
access_token是調(diào)用授權關系接口的調(diào)用憑證,由于access_token有效期(目前為2個小時)較短,當access_token超時后,可以使用refresh_token進行刷新,access_token刷新結果有兩種:
1. 若access_token已超時,那么進行refresh_token會獲取一個新的access_token,新的超時時間;
2.若access_token未超時,那么進行refresh_token不會改變access_token,但超時時間會刷新,相當于續(xù)期access_token。
refresh_token擁有較長的有效期(30天),當refresh_token失效的后,需要用戶重新授權。
請求方法
使用/sns/oauth2/access_token接口獲取到的refresh_token進行以下接口調(diào)用:
http請求方式: GET
參數(shù)說明
參數(shù) | 是否必須 | 說明 |
---|---|---|
appid | 是 | 應用唯一標識 |
grant_type | 是 | 填refresh_token |
refresh_token | 是 | 填寫通過access_token獲取到的refresh_token參數(shù) |
返回說明
正確的返回:
{
"access_token":"ACCESS_TOKEN",
"expires_in":7200,
"refresh_token":"REFRESH_TOKEN",
"openid":"OPENID",
"scope":"SCOPE"
}
參數(shù) | 說明 |
---|---|
access_token | 接口調(diào)用憑證 |
expires_in | access_token接口調(diào)用憑證超時時間,單位(秒) |
refresh_token | 用戶刷新access_token |
openid | 授權用戶唯一標識 |
scope | 用戶授權的作用域,使用逗號(,)分隔 |
錯誤返回樣例:
{
"errcode":40030,"errmsg":"invalid refresh_token"
}
接口說明
檢驗授權憑證(access_token)是否有效
請求說明
http請求方式: GET
https://api.weixin.qq.com/sns/auth?access_token=ACCESS_TOKEN&openid=OPENID
參數(shù)說明
參數(shù) | 是否必須 | 說明 |
---|---|---|
access_token | 是 | 調(diào)用接口憑證 |
openid | 是 | 普通用戶標識,對該公眾帳號唯一 |
返回說明
正確的Json返回結果:
{
"errcode":0,"errmsg":"ok"
}
錯誤的Json返回示例:
{
"errcode":40003,"errmsg":"invalid openid"
}
獲取用戶個人信息(UnionID機制)
接口說明
此接口用于獲取用戶個人信息。開發(fā)者可通過OpenID來獲取用戶基本信息。特別需要注意的是,如果開發(fā)者擁有多個移動應用、網(wǎng)站應用和公眾帳號,可通過獲取用戶基本信息中的unionid來區(qū)分用戶的唯一性,因為只要是同一個微信開放平臺帳號下的移動應用、網(wǎng)站應用和公眾帳號,用戶的unionid是唯一的。換句話說,同一用戶,對同一個微信開放平臺下的不同應用,unionid是相同的。
請求說明
http請求方式: GET
https://api.weixin.qq.com/sns/userinfo?access_token=ACCESS_TOKEN&openid=OPENID
參數(shù)說明
參數(shù) | 是否必須 | 說明 |
---|---|---|
access_token | 是 | 調(diào)用憑證 |
openid | 是 | 普通用戶的標識,對當前開發(fā)者帳號唯一 |
返回說明
正確的Json返回結果:
{ "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" }
參數(shù) | 說明 |
---|---|
openid | 普通用戶的標識,對當前開發(fā)者帳號唯一 |
nickname | 普通用戶昵稱 |
sex | 普通用戶性別,1為男性,2為女性 |
province | 普通用戶個人資料填寫的省份 |
city | 普通用戶個人資料填寫的城市 |
country | 國家,如中國為CN |
headimgurl | 用戶頭像,最后一個數(shù)值代表正方形頭像大?。ㄓ?、46、64、96、132數(shù)值可選,0代表640*640正方形頭像),用戶沒有頭像時該項為空 |
privilege | 用戶特權信息,json數(shù)組,如微信沃卡用戶為(chinaunicom) |
unionid | 用戶統(tǒng)一標識。針對一個微信開放平臺帳號下的應用,同一用戶的unionid是唯一的。 |
錯誤的Json返回示例:
{
"errcode":40003,"errmsg":"invalid openid"
}
調(diào)用頻率限制
接口名 | 頻率限制 |
---|---|
通過code換取access_token | 1萬/分鐘 |
刷新access_token | 5萬/分鐘 |
獲取用戶基本信息 | 5萬/分鐘 |
以上就是對微信網(wǎng)頁第三方登錄原理的資料整理,后續(xù)繼續(xù)補充相關資料謝謝大家對本站的支持!
- 微信網(wǎng)頁授權(OAuth2.0) PHP 源碼簡單實現(xiàn)
- PHP實現(xiàn)微信網(wǎng)頁授權開發(fā)教程
- 微信舉報解除和微信解除限制的6個方法
- .Net語言Smobiler開發(fā)之如何仿微信朋友圈的消息樣式
- 微信+angularJS的SPA應用中用router進行頁面跳轉(zhuǎn),jssdk校驗失敗問題解決
- Android Fragment+FragmentTabHost組件實現(xiàn)常見主頁面(仿微信新浪)
- Android仿微信頁面底部導航效果代碼實現(xiàn)
- Ajax輪詢請求狀態(tài)(微信公眾號帶參數(shù)二維碼登錄網(wǎng)站)
- ionic在開發(fā)ios系統(tǒng)微信時鍵盤擋住輸入框的解決方法(鍵盤彈出問題)
- Android仿微信圖片點擊瀏覽的效果
- Android仿微信清理內(nèi)存圖表動畫(解決surfaceView屏幕閃爍問題)demo實例詳解
- 詳解SwipeListView框架實現(xiàn)微信\QQ滑動刪除效果
相關文章
Android BottomSheetDialog實現(xiàn)底部對話框的示例
這篇文章主要介紹了Android BottomSheetDialog實現(xiàn)底部對話框的示例,小編覺得挺不錯的,現(xiàn)在分享給大家,也給大家做個參考。一起跟隨小編過來看看吧2018-06-06Android圖片的Base64編碼與解碼及解碼Base64圖片方法
Base64是網(wǎng)絡上最常見的用于傳輸8Bit字節(jié)碼的編碼方式之一,Base64就是一種基于64個可打印字符來表示二進制數(shù)據(jù)的方法。接下來通過本文給大家分享Android圖片的Base64編碼與解碼及解碼Base64圖片,需要的朋友參考下吧2017-12-12Android游戲開發(fā)之碰撞檢測(矩形碰撞、圓形碰撞、像素碰撞)
這篇文章主要介紹了Android游戲開發(fā)之碰撞檢測,主要內(nèi)容包含矩形碰撞、圓形碰撞、像素碰撞、多矩形碰撞的代碼,感興趣的小伙伴們可以參考一下2016-07-07flutter升級3.7.3報錯Unable?to?find?bundled?Java?version解決
這篇文章主要介紹了flutter升級3.7.3報錯Unable?to?find?bundled?Java?version解決,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進步,早日升職加2023-02-02Android開發(fā)中使用Intent打開第三方應用及驗證可用性的方法詳解
這篇文章主要介紹了Android開發(fā)中使用Intent打開第三方應用及驗證可用性的方法,結合實例形式分析了Android使用Intent打開第三方應用的三種常用方式及使用注意事項,需要的朋友可以參考下2017-11-11