微信 第三方登录
轉自：http://www.cnblogs.com/linjunjie/p/6378166.html#3902595
l 申請開發者賬號之內的就不累贅了，網上一大堆：說下需求，一個網頁要在三類容器運行，公司app，微信自動登錄，瀏覽器。
假設是已經申請完成各平臺開發者賬號。
先來簡單的，微博和QQ
微博：
引入微博JS
<script src="http://tjs.sjs.sinajs.cn/open/api/js/wb.js?appkey=*******&debug=true" type="text/javascript" charset="utf-8"></script>appkey中，填入你的微博開發者id(替換****)
| 1 | <span?id="wb_connect_btn">微博登錄按鈕</span> |
在你的頁面微博登錄按鈕標簽上，加入以上id。頁面加載時，微博會自動加載樣式，你也可以自己強行修改。
<script>WB2.anyWhere(function (W) {W.widget.connectButton({id: "wb_connect_btn",type: '3,2',callback: {login: function (o) { //登錄后的回調函數console.log(o);thirdparty(null,null,o.avatar_hd, o.name ,3, o.id);//個人方法try{document.getElementsByClassName('loginout')[0].click();//頁面需求，當前頁面登錄完成之后，不進行跳轉，所以模擬點擊事件，讓微博賬號在當前域中退出。不影響下次登錄。（元素為微博動態添加）
//微博沒有提供退出方法。下面的logout為另一種開發模式調用。
}catch(e){console.log(e);}},logout: function () { //退出后的回調函數 }}});}); </script>
將以上標簽全部加入html中。
至此，只要在頁面中登錄之后，就能在控制臺看到返回數據。當然，測試要在微博注冊的域下。
?QQ登錄：
和微博一樣，引入JavaScript文件
<script type="text/javascript" src="http://qzonestyle.gtimg.cn/qzone/openapi/qc_loader.js" data-appid="******" charset="utf-8"></script>微博類似，替換為你的appid
<span id="qqLoginBtn"></span>登錄標簽中加入id標識
然后JavaScript中加入以下代碼：
QC.Login({//btnId：插入按鈕的節點id，必選btnId:"qqLoginBtn",//用戶需要確認的scope授權項，可選，默認allscope:"all",//按鈕尺寸，可用值[A_XL| A_L| A_M| A_S| B_M| B_S| C_S]，可選，默認B_Ssize: "B_S"}, function(reqData, opts){//登錄成功//根據返回數據，更換按鈕顯示狀態方法 console.log(reqData);//查看返回數據QC.Login.getMe(function(openId, accessToken){//獲取用戶的openIdconsole.log('QQOPENID:'+openId);thirdparty(null,null,reqData.figureurl_qq_2,reqData.nickname,1,openId);QC.Login.signOut();//退出QQ登錄調用事件});});測試要在QQ中注冊的域名下。重要的事情，再說一遍。
QQ和微博登錄，大致相同，只要引入JS文件，然后直接調用方法即可，QQ比微博更和諧，直接提供退出事件。上面代碼中有。。
現在來說最蛋疼的微信登錄。
微信登錄提供兩種方法：
第一種，掃碼登錄：
需要在微信開發者平臺中，注冊獲取appId。
微信登錄按鈕：
<span class="weixin-login"></span>在你微信登錄按鈕上，添加點擊事件，執行以下代碼：
$('.weixin-login').on('click',function(){window.location.href='https://open.weixin.qq.com/connect/qrconnect?' +'appid=*******&redirect_uri=http%3a%2f%2fwww.xxxxxx.com%2f'+window.location.pathname.substr(1)+'&response_type=code&scope=snsapi_login&state=3d6be0a4035d839573b04816624a415e#wechat_redirect';});需要替換：
redirect_url:要想傳當前url，直接encodeURIComponent(window.location.href) //當然，需要你自己進行拼接，不懂的留言
至此，當用戶點擊之后，跳轉至掃碼界面：
例如：https://passport.yhd.com/wechat/callback.do?code=CODE&state=3d6be0a4035d839573b04816624a415e
至此，拿到第一步令牌，code。在你的回調頁面中，你要獲取url中的code去和微信換取下一步的令牌。因為換取下一步的令牌需要涉及到跨域請求，但是微信不讓跨域請求，只能在后臺進行后續事項。
第二步，后臺請求：https://api.weixin.qq.com/sns/oauth2/access_token?appid=[APPID]&secret=[SECRET]&code=[CODE]&grant_type=authorization_code
替換中括號中的數據。（我走的get請求）。
返回以下數據：
{ "access_token":"ACCESS_TOKEN", "expires_in":7200, "refresh_token":"REFRESH_TOKEN", "openid":"OPENID", "scope":"SCOPE", "unionid": "o6_bmasdasdsad6_2sgVt7hMZOPfL" }最后一步就不說了：
https://api.weixin.qq.com/sns/userinfo?access_token=[ACCESS_TOKEN]&openid=[OPENID]
替換成上次請求獲取到的數據，再請求一次，獲獎用戶基本信息。
1、OAuth2.0
OAuth（開放授權）是一個開放標準，允許用戶讓第三方應用訪問該用戶在某一網站上存儲的私密的資源（如照片，視頻，聯系人列表），而無需將用戶名和密碼提供給第三方應用。
允許用戶提供一個令牌，而不是用戶名和密碼來訪問他們存放在特定服務提供者的數據。每一個令牌授權一個特定的網站（例如，視頻編輯網站)在特定的時段（例如，接下來的2小時內）內訪問特定的資源（例如僅僅是某一相冊中的視頻）。這樣，OAuth允許用戶授權第三方網站訪問他們存儲在另外的服務提供者上的信息，而不需要分享他們的訪問許可或他們數據的所有內容。2、目標我們這里主要模擬使用OAuth2.0，用戶通過掃描我們網頁應用的二維碼并進行授權登錄來獲取用戶的基本信息的過程。詳細的接口相關信息可以在微信開放平臺上查看：https://open.weixin.qq.com/cgi-bin/showdocument?action=dir_list&t=resource/res_list&verify=1&lang=zh_CN3、前期準備（獲取微信開發者權限）我們這里主要講的是網站（Web）應用，網站應用微信登錄是基于OAuth2.0協議標準構建的微信OAuth2.0授權登錄系統(即上面的協議)。在微信客戶端授權登錄(獲取用戶信息）的可以查看:http://www.cnblogs.com/0201zcr/p/5131602.html在進行微信OAuth2.在進行微信OAuth2.0授權登錄接入之前，在微信開放平臺注冊開發者帳號，并擁有一個已審核通過的網站應用，并獲得相應的AppID和AppSecret，申請微信登錄且通過審核后，可開始接入流程。
3.1、注冊開發者賬號可以在https://open.weixin.qq.com/?這里申請開發的賬號。由于是騰訊的網頁，這里可以直接通過?QQ號進行登錄。3.2、提交網站應用審核在已經登錄的界面中選擇“管理中心”——》網站應用——》創建網站應用將會彈出下面的界面填寫過后，還有有一個頁面需要填寫，提交一份紙質版申請書掃描件（會提供模板，我們下載再來填寫后，需蓋章，簽名），配置回調域名（掃碼登錄后會跳轉的頁面）等。之后提交審核即可，等微信審核通過，我們即可獲得我們需要的網頁應用的appid和AppSecret，并配置后回調的域名了（這三樣是我們開發所必須的）。3.3、開發者資質認證由于我們這里要使用微信登錄的接口，所以我們還需要向微信提出認證，只有認證了才能使用微信那些高級的接口。未認證的如下圖所示認證之后是這樣子的：我現在暫時沒有找到可以向公眾賬號那樣子的測試賬號的申請。如果有知道怎么可以申請到測試賬號的高手，希望能賜教一下。接下來，我們就可以開始我們的網頁微信掃碼登錄開發了。4、授權流程說明微信OAuth2.0授權登錄讓微信用戶使用微信身份安全登錄第三方應用或網站，在微信用戶授權登錄已接入微信OAuth2.0的第三方應用后，第三方可以獲取到用戶的接口調用憑證（access_token），通過access_token可以進行微信開放平臺授權關系接口調用，從而可實現獲取微信用戶基本開放信息和幫助用戶實現基礎開放功能等。微信OAuth2.0授權登錄目前支持authorization_code模式，適用于擁有server端的應用授權。該模式整體流程為：
1. 第三方發起微信授權登錄請求，微信用戶允許授權第三方應用后，微信會拉起應用或重定向到第三方網站，并且帶上授權臨時票據code參數； 2. 通過code參數加上AppID和AppSecret等，通過API換取access_token； 3. 通過access_token進行接口調用，獲取用戶基本數據資源或幫助用戶實現基本操作。? 獲取access_token時序圖：
5、獲取網頁的二維碼當我們通過微信的認證，獲取到了appid和AppSecret，并配置了回調的域名。我們就已經可以獲取屬于我們網頁的二維碼了，獲取的方式很簡單，只需打開一個微信的鏈接，加上我們的appid和回調域名即可在網頁上面打開二維碼，用戶用微信客戶端掃碼并授權登錄之后即會跳轉到我們配置的回調域名下。注意：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鑒權5.1、請求url說明
第三方使用網站應用授權登錄前請注意已獲取相應網頁授權作用域（scope=snsapi_login），則可以通過在PC端打開以下鏈接：
https://open.weixin.qq.com/connect/qrconnect?appid=APPID&redirect_uri=REDIRECT_URI&response_type=code&scope=SCOPE&state=STATE#wechat_redirect?
?參數說明| appid | 是 | 應用唯一標識（前面認證網頁應用中獲得） |
| redirect_uri | 是 | 重定向地址，需要進行UrlEncode（前面認證網頁應用中獲得） |
| response_type | 是 | 填code |
| scope | 是 | 應用授權作用域，擁有多個作用域用逗號（,）分隔，網頁應用目前僅填寫snsapi_login即可 |
| state | 否 | 用于保持請求和回調的狀態，授權請求后原樣帶回給第三方。該參數可用于防止csrf攻擊（跨站請求偽造攻擊），建議第三方帶上該參數，可設置為簡單的隨機數加session進行校驗 |
? 若用戶禁止授權，則重定向后不會帶上code參數，僅會帶上state參數
redirect_uri?state=STATE5.2、事例：
一號店的微信二維碼鏈接如下：
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? 將其復制到瀏覽器中打開即可獲得一號店的二維碼，二維碼頁面如下：
通過使用微信客戶端的掃一掃功能，掃描該二維碼，即會跳轉到上面填寫redirect_uri所在的地址上。假如用戶同意授權，這里就獲得了微信返回的code參數了。
6、獲取用戶信息
假如前面已經獲得code。我們可以通過code參數去獲取用戶openid和access_token,進而獲得用戶的信息。6.1、通過code參數獲取access_tokenhttps://api.weixin.qq.com/sns/oauth2/access_token?appid=APPID&secret=SECRET&code=CODE&grant_type=authorization_code?參數說明
| appid | 是 | 應用唯一標識，在微信開放平臺提交應用審核通過后獲得 |
| secret | 是 | 應用密鑰AppSecret，在微信開放平臺提交應用審核通過后獲得 |
| code | 是 | 填寫第一步獲取的code參數 |
| grant_type | 是 | 填authorization_code |
返回說明
正確的返回：
{ "access_token":"ACCESS_TOKEN", "expires_in":7200, "refresh_token":"REFRESH_TOKEN", "openid":"OPENID", "scope":"SCOPE", "unionid": "o6_bmasdasdsad6_2sgVt7hMZOPfL" }| access_token | 接口調用憑證 |
| expires_in | access_token接口調用憑證超時時間，單位（秒） |
| refresh_token | 用戶刷新access_token |
| openid | 授權用戶唯一標識 |
| scope | 用戶授權的作用域，使用逗號（,）分隔 |
| ?unionid | 當且僅當該網站應用已獲得該用戶的userinfo授權時，才會出現該字段。 |
錯誤返回樣例：
{"errcode":40029,"errmsg":"invalid code"}注意：- code參數的超時時間是5分鐘，且每次請求的code參數的值都不一樣。
- access_token的超時時間是32分鐘。
- access_token有效且為超時；
- 微信用戶已授權給第三方應用賬號相應接口作用域（scope)【在二維碼生成連接那里填寫】
| snsapi_base | /sns/oauth2/access_token | 通過code換取access_token、refresh_token和已授權scope |
| /sns/oauth2/refresh_token | 刷新或續期access_token使用 | |
| /sns/auth | 檢查access_token有效性 | |
| snsapi_userinfo | /sns/userinfo | 獲取用戶個人信息 |
?參數說明
| access_token | 是 | 調用憑證（上一個請求中獲得） |
| openid | 是 | 普通用戶的標識，對當前開發者帳號唯一（上一個請求中獲得） |
| ? ? ? ?lang | ? 否 | 國家地區語言版本，zh_CN 簡體，zh_TW 繁體，en 英語，默認為zh-CN |
返回說明
正確的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"}| openid | 普通用戶的標識，對當前開發者帳號唯一 |
| nickname | 普通用戶昵稱 |
| sex | 普通用戶性別，1為男性，2為女性 |
| province | 普通用戶個人資料填寫的省份 |
| city | 普通用戶個人資料填寫的城市 |
| country | 國家，如中國為CN |
| headimgurl | 用戶頭像，最后一個數值代表正方形頭像大小（有0、46、64、96、132數值可選，0代表640*640正方形頭像），用戶沒有頭像時該項為空 |
| privilege | 用戶特權信息，json數組，如微信沃卡用戶為（chinaunicom） |
| unionid | 用戶統一標識。針對一個微信開放平臺帳號下的應用，同一用戶的unionid是唯一的。 |
錯誤的Json返回示例:
{ "errcode":40003,"errmsg":"invalid openid" }7、總結?
最近著手開發了微信網頁掃碼登錄和公眾號授權登錄收獲頗豐，兩者的開發很類似。以下是我個人摸索過程中發現的兩者的異同：
- 兩者都可以通過微信客戶端掃碼授權的方式，讓第三方頁面獲得微信用戶的一些基本信息（昵稱、性別、所在地、在微信唯一標示等……）。他們都是通過提供一個鏈接讓用戶授權的方式。但網頁版需要在頁面打開二維碼之后授權，而公眾號則需要用戶先關注了我們的公眾號，然后點開公眾號里面的鏈接，確認授權即可。
- 網頁掃碼登錄需要將授權的鏈接（二維碼鏈接）在網頁中打開、而公眾號授權登錄的鏈接必須要微信客戶端中打開。
- 無論網頁掃碼登錄還是在公眾號中授權登錄，都是通過授權的方式獲得一個code參數，之后通過code參數獲取access_token和openid和通過access_token和openid去獲取用戶的基本信息的請求鏈接是一樣的。
- 在開發公眾號授權登錄的過程中，我發現了有測試賬號的提供，足以滿足我們的測試和開發，但在開發網頁掃碼時，暫時未發現哪里能獲取測試賬號，我是通過申請獲取的。（希望知道哪里有測試賬號的請求高手賜教）。
第一步：獲取AppID?AppSecret(不做解釋，自己去微信公眾平臺申請)
?
第二步：生成掃描二維碼，獲取codehttps://open.weixin.qq.com/connect/qrconnect?appid=AppID&redirect_uri=http://www.baidu.com&response_type=code&scope=snsapi_login&state=2014#wechat_redirect
第三步：通過code獲取access_token
https://api.weixin.qq.com/sns/oauth2/access_token?appid=AppID&secret=AppSecret&code=00294221aeb06261d5966&grant_type=authorization_code第四步：因接口頻率有次數限制，如果需要，刷新access_tokenhttps://api.weixin.qq.com/sns/oauth2/refresh_token?appid=AppID&grant_type=refresh_token&refresh_token=REFRESH_TOKEN
????第五步：通過access_token和openid獲取用戶的基礎信息，包括頭像、昵稱、性別、地區https://api.weixin.qq.com/sns/userinfo?access_token=bezXEiiBSKSxW0eoblIewFNHqAG-PyW9OqI_L81E4ZCi2cFpfoJTyQc0xKlPPCtqK1kLJfiRbVrpoOVLw7fjpqh52bn7C68SHa2HSgYsVPXZPvJvtayDa57-_7TeHYw&openid=o39YsbmuV_bIPGpj1MTe
這是接口在線調試工具：http://mp.weixin.qq.com/debug/
這是錯誤碼說明文檔：http://mp.weixin.qq.com/wiki/17/fa4e1434e57290788bde25603fa2fcbd.html? 另外需要特別注意，如果開發者有在多個公眾號，或在公眾號、移動應用之間統一用戶帳號的需求，需要前往微信開放平臺（open.weixin.qq.com）綁定公眾號后，才可利用UnionID機制來滿足上述需求，文檔：
http://mp.weixin.qq.com/wiki/14/bb5031008f1494a59c6f71fa0f319c66.html
微信網頁第三方登錄原理
微信開放平臺和公眾平臺的區別
1.公眾平臺面向的時普通的用戶，比如自媒體和媒體，企業官方微信公眾賬號運營人員使用，當然你所在的團隊或者公司有實力去開發一些內容，也可以調用公眾平臺里面的接口，比如自定義菜單，自動回復，查詢功能。目前大多數微信通過認證之后，都在做這個事情。
mp.weixin.qq.com
2.開放平臺面向的開發者和第三方獨立軟件開發商。我覺得開發平臺最大的開放就是微信登錄。當年騰訊沒有花大力氣去做統一登錄這個事情，導致目前各個網站都要弄一套登錄機制。好在他們現在認清了局勢。開發者或軟件開發商，通過微信開放提供的平臺和接口，可以開發適合企業的電子商務網站，掃描二維碼進去一個游戲界面，然后去購買商品等。當然后續開放平臺要開放支付接口，那么類似口袋通這種軟件開發廠商，就可以為大型，中小企業提供微信小店這種服務和軟件了。
open.weixin.qq.com
?
公眾平臺就是服務號訂閱號的管理開發后臺。
開發平臺說得通俗一點就是實現手機里邊安裝軟件的內容一鍵分享朋友圈；
下面的第三方登陸就是依托于開放平臺（open.weixin.qq.com）的功能
?
準備工作
網站應用微信登錄是基于OAuth2.0協議標準構建的微信OAuth2.0授權登錄系統。
在進行微信OAuth2.在進行微信OAuth2.0授權登錄接入之前，在微信開放平臺注冊開發者帳號，并擁有一個已審核通過的網站應用，并獲得相應的AppID和AppSecret，申請微信登錄且通過審核后，可開始接入流程。
授權流程說明
微信OAuth2.0授權登錄讓微信用戶使用微信身份安全登錄第三方應用或網站，在微信用戶授權登錄已接入微信OAuth2.0的第三方應用后，第三方可以獲取到用戶的接口調用憑證（access_token），通過access_token可以進行微信開放平臺授權關系接口調用，從而可實現獲取微信用戶基本開放信息和幫助用戶實現基礎開放功能等。
微信OAuth2.0授權登錄目前支持authorization_code模式，適用于擁有server端的應用授權。該模式整體流程為：
1. 第三方發起微信授權登錄請求，微信用戶允許授權第三方應用后，微信會拉起應用或重定向到第三方網站，并且帶上授權臨時票據code參數；
2. 通過code參數加上AppID和AppSecret等，通過API換取access_token；
3. 通過access_token進行接口調用，獲取用戶基本數據資源或幫助用戶實現基本操作。
獲取access_token時序圖：
第一步：請求CODE
第三方使用網站應用授權登錄前請注意已獲取相應網頁授權作用域（scope=snsapi_login），則可以通過在PC端打開以下鏈接：
https://open.weixin.qq.com/connect/qrconnect?appid=APPID&redirect_uri=REDIRECT_URI&response_type=code&scope=SCOPE&state=STATE#wechat_redirect
若提示“該鏈接無法訪問”，請檢查參數是否填寫錯誤，如redirect_uri的域名與審核時填寫的授權域名不一致或scope不為snsapi_login。
參數說明
| appid | 是 | 應用唯一標識 |
| redirect_uri | 是 | 重定向地址，需要進行UrlEncode |
| response_type | 是 | 填code |
| scope | 是 | 應用授權作用域，擁有多個作用域用逗號（,）分隔，網頁應用目前僅填寫snsapi_login即可 |
| state | 否 | 用于保持請求和回調的狀態，授權請求后原樣帶回給第三方。該參數可用于防止csrf攻擊（跨站請求偽造攻擊），建議第三方帶上該參數，可設置為簡單的隨機數加session進行校驗 |
返回說明
用戶允許授權后，將會重定向到redirect_uri的網址上，并且帶上code和state參數
redirect_uri?code=CODE&state=STATE
若用戶禁止授權，則重定向后不會帶上code參數，僅會帶上state參數
redirect_uri?state=STATE
請求示例
登錄一號店網站應用
https://passport.yhd.com/wechat/login.do
打開后，一號店會生成state參數，跳轉到
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端會跳轉到
https://passport.yhd.com/wechat/callback.do?code=CODE&state=3d6be0a4035d839573b04816624a415e
為了滿足網站更定制化的需求，我們還提供了第二種獲取code的方式，支持網站將微信登錄二維碼內嵌到自己頁面中，用戶使用微信掃碼授權后通過JS將code返回給網站。
JS微信登錄主要用途：網站希望用戶在網站內就能完成登錄，無需跳轉到微信域下登錄后再返回，提升微信登錄的流暢性與成功率。 網站內嵌二維碼微信登錄JS實現辦法：
步驟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: ""
? ? ? ? ? ? ? ? ? ? ? ? ? ? });
參數說明
| id | 是 | 第三方頁面顯示二維碼的容器id |
| appid | 是 | 應用唯一標識，在微信開放平臺提交應用審核通過后獲得 |
| scope | 是 | 應用授權作用域，擁有多個作用域用逗號（,）分隔，網頁應用目前僅填寫snsapi_login即可 |
| redirect_uri | 是 | 重定向地址，需要進行UrlEncode |
| state | 否 | 用于保持請求和回調的狀態，授權請求后原樣帶回給第三方。該參數可用于防止csrf攻擊（跨站請求偽造攻擊），建議第三方帶上該參數，可設置為簡單的隨機數加session進行校驗 |
| style | 否 | 提供"black"、"white"可選，默認為黑色文字描述。詳見文檔底部FAQ |
| href | 否 | 自定義樣式鏈接，第三方可根據實際需求覆蓋默認樣式。詳見文檔底部FAQ |
?
第二步：通過code獲取access_token
通過code獲取access_token
https://api.weixin.qq.com/sns/oauth2/access_token?appid=APPID&secret=SECRET&code=CODE&grant_type=authorization_code
參數說明
| appid | 是 | 應用唯一標識，在微信開放平臺提交應用審核通過后獲得 |
| secret | 是 | 應用密鑰AppSecret，在微信開放平臺提交應用審核通過后獲得 |
| code | 是 | 填寫第一步獲取的code參數 |
| grant_type | 是 | 填authorization_code |
返回說明
正確的返回：
{?
"access_token":"ACCESS_TOKEN",?
"expires_in":7200,?
"refresh_token":"REFRESH_TOKEN",
"openid":"OPENID",?
"scope":"SCOPE","unionid": "o6_bmasdasdsad6_2sgVt7hMZOPfL"}
?
| access_token | 接口調用憑證 |
| expires_in | access_token接口調用憑證超時時間，單位（秒） |
| refresh_token | 用戶刷新access_token |
| openid | 授權用戶唯一標識 |
| scope | 用戶授權的作用域，使用逗號（,）分隔 |
| ?unionid | 只有在用戶將公眾號綁定到微信開放平臺帳號后，才會出現該字段。 |
錯誤返回樣例：
{"errcode":40029,"errmsg":"invalid code"}
刷新access_token有效期
access_token是調用授權關系接口的調用憑證，由于access_token有效期（目前為2個小時）較短，當access_token超時后，可以使用refresh_token進行刷新，access_token刷新結果有兩種：
1. 若access_token已超時，那么進行refresh_token會獲取一個新的access_token，新的超時時間；
2. 若access_token未超時，那么進行refresh_token不會改變access_token，但超時時間會刷新，相當于續期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
參數說明
| appid | 是 | 應用唯一標識 |
| grant_type | 是 | 填refresh_token |
| refresh_token | 是 | 填寫通過access_token獲取到的refresh_token參數 |
返回說明
正確的返回：
{?
"access_token":"ACCESS_TOKEN",?
"expires_in":7200,?
"refresh_token":"REFRESH_TOKEN",?
"openid":"OPENID",?
"scope":"SCOPE"?
}
| access_token | 接口調用憑證 |
| expires_in | access_token接口調用憑證超時時間，單位（秒） |
| refresh_token | 用戶刷新access_token |
| openid | 授權用戶唯一標識 |
| scope | 用戶授權的作用域，使用逗號（,）分隔 |
?
錯誤返回樣例：
{"errcode":40030,"errmsg":"invalid refresh_token"}
注意：
1、Appsecret 是應用接口使用密鑰，泄漏后將可能導致應用數據泄漏、應用的用戶數據泄漏等高風險后果；存儲在客戶端，極有可能被惡意竊取（如反編譯獲取Appsecret）；
2、access_token 為用戶授權第三方應用發起接口調用的憑證（相當于用戶登錄態），存儲在客戶端，可能出現惡意獲取access_token 后導致的用戶數據泄漏、用戶微信相關接口功能被惡意發起等行為；
3、refresh_token 為用戶授權第三方應用的長效憑證，僅用于刷新access_token，但泄漏后相當于access_token 泄漏，風險同上。
?
建議將secret、用戶數據（如access_token）放在App云端服務器，由云端中轉接口調用請求。
?
第三步：通過access_token調用接口
獲取access_token后，進行接口調用，有以下前提：
1. access_token有效且未超時；
2. 微信用戶已授權給第三方應用帳號相應接口作用域（scope）。
?
對于接口作用域（scope），能調用的接口有以下：
| snsapi_base | /sns/oauth2/access_token | 通過code換取access_token、refresh_token和已授權scope |
| /sns/oauth2/refresh_token | 刷新或續期access_token使用 | |
| /sns/auth | 檢查access_token有效性 | |
| snsapi_userinfo | /sns/userinfo | 獲取用戶個人信息 |
其中snsapi_base屬于基礎接口，若應用已擁有其它scope權限，則默認擁有snsapi_base的權限。使用snsapi_base可以讓移動端網頁授權繞過跳轉授權登錄頁請求用戶授權的動作，直接跳轉第三方網頁帶上授權臨時票據（code），但會使得用戶已授權作用域（scope）僅為snsapi_base，從而導致無法獲取到需要用戶授權才允許獲得的數據和基礎功能。
接口調用方法可查閱《微信授權關系接口調用指南》
F.A.Q
1. 什么是授權臨時票據（code）？
答：第三方通過code進行獲取access_token的時候需要用到，code的超時時間為10分鐘，一個code只能成功換取一次access_token即失效。code的臨時性和一次保障了微信授權登錄的安全性。第三方可通過使用https和state參數，進一步加強自身授權登錄的安全性。
?
2. 什么是授權作用域（scope）？
答：授權作用域（scope）代表用戶授權給第三方的接口權限，第三方應用需要向微信開放平臺申請使用相應scope的權限后，使用文檔所述方式讓用戶進行授權，經過用戶授權，獲取到相應access_token后方可對接口進行調用。
3. 網站內嵌二維碼微信登錄JS代碼中style字段作用？
答：第三方頁面顏色風格可能為淺色調或者深色調，若第三方頁面為淺色背景，style字段應提供"black"值（或者不提供，black為默認值），則對應的微信登錄文字樣式為黑色。相關效果如下：
若提供"white"值，則對應的文字描述將顯示為白色，適合深色背景。相關效果如下：
4.網站內嵌二維碼微信登錄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
https://api.weixin.qq.com/sns/oauth2/access_token?appid=APPID&secret=SECRET&code=CODE&grant_type=authorization_code
參數說明
| appid | 是 | 應用唯一標識，在微信開放平臺提交應用審核通過后獲得 |
| secret | 是 | 應用密鑰AppSecret，在微信開放平臺提交應用審核通過后獲得 |
| code | 是 | 填寫第一步獲取的code參數 |
| grant_type | 是 | 填authorization_code |
返回說明
正確的返回：
{?
"access_token":"ACCESS_TOKEN",?
"expires_in":7200,?
"refresh_token":"REFRESH_TOKEN",
"openid":"OPENID",?
"scope":"SCOPE"?
}
| access_token | 接口調用憑證 |
| expires_in | access_token接口調用憑證超時時間，單位（秒） |
| refresh_token | 用戶刷新access_token |
| openid | 授權用戶唯一標識 |
| scope | 用戶授權的作用域，使用逗號（,）分隔 |
錯誤返回樣例：
{
"errcode":40029,"errmsg":"invalid code"
}
刷新或續期access_token使用
接口說明
access_token是調用授權關系接口的調用憑證，由于access_token有效期（目前為2個小時）較短，當access_token超時后，可以使用refresh_token進行刷新，access_token刷新結果有兩種：
1. 若access_token已超時，那么進行refresh_token會獲取一個新的access_token，新的超時時間；
2.若access_token未超時，那么進行refresh_token不會改變access_token，但超時時間會刷新，相當于續期access_token。
refresh_token擁有較長的有效期（30天），當refresh_token失效的后，需要用戶重新授權。
請求方法
使用/sns/oauth2/access_token接口獲取到的refresh_token進行以下接口調用：
http請求方式: GET
https://api.weixin.qq.com/sns/oauth2/refresh_token?appid=APPID&grant_type=refresh_token&refresh_token=REFRESH_TOKEN
參數說明
| appid | 是 | 應用唯一標識 |
| grant_type | 是 | 填refresh_token |
| refresh_token | 是 | 填寫通過access_token獲取到的refresh_token參數 |
返回說明
正確的返回：
{?
"access_token":"ACCESS_TOKEN",?
"expires_in":7200,?
"refresh_token":"REFRESH_TOKEN",?
"openid":"OPENID",?
"scope":"SCOPE"?
}
| access_token | 接口調用憑證 |
| expires_in | access_token接口調用憑證超時時間，單位（秒） |
| 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
參數說明
| access_token | 是 | 調用接口憑證 |
| openid | 是 | 普通用戶標識，對該公眾帳號唯一 |
返回說明
正確的Json返回結果：
{?
"errcode":0,"errmsg":"ok"
}
錯誤的Json返回示例:
{?
"errcode":40003,"errmsg":"invalid openid"
}
獲取用戶個人信息（UnionID機制）
接口說明
此接口用于獲取用戶個人信息。開發者可通過OpenID來獲取用戶基本信息。特別需要注意的是，如果開發者擁有多個移動應用、網站應用和公眾帳號，
可通過獲取用戶基本信息中的unionid來區分用戶的唯一性，因為只要是同一個微信開放平臺帳號下的移動應用、網站應用和公眾帳號，用戶的unionid是唯一的。換句話說，同一用戶，對同一個微信開放平臺下的不同應用，unionid是相同的。
請求說明
http請求方式: GET
https://api.weixin.qq.com/sns/userinfo?access_token=ACCESS_TOKEN&openid=OPENID
參數說明
| access_token | 是 | 調用憑證 |
| openid | 是 | 普通用戶的標識，對當前開發者帳號唯一 |
返回說明
正確的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"
}
| openid | 普通用戶的標識，對當前開發者帳號唯一 |
| nickname | 普通用戶昵稱 |
| sex | 普通用戶性別，1為男性，2為女性 |
| province | 普通用戶個人資料填寫的省份 |
| city | 普通用戶個人資料填寫的城市 |
| country | 國家，如中國為CN |
| headimgurl | 用戶頭像，最后一個數值代表正方形頭像大小（有0、46、64、96、132數值可選，0代表640*640正方形頭像），用戶沒有頭像時該項為空 |
| privilege | 用戶特權信息，json數組，如微信沃卡用戶為（chinaunicom） |
| unionid | 用戶統一標識。針對一個微信開放平臺帳號下的應用，同一用戶的unionid是唯一的。 |
錯誤的Json返回示例:
{?
"errcode":40003,"errmsg":"invalid openid"
}
調用頻率限制
| 通過code換取access_token | 1萬/分鐘 |
| 刷新access_token | 5萬/分鐘 |
| 獲取用戶基本信息 | 5萬/分鐘 |
第一步：填寫服務器配置
第二步：驗證服務器地址的有效性
第三步：依據接口文檔實現業務邏輯
用戶向公眾號發送消息時，公眾號方收到的消息發送者是一個OpenID，是使用用戶微信號加密后的結果，每個用戶對每個公眾號有一個唯一的OpenID。此外，由于開發者經常有需在多個平臺（移動應用、網站、公眾帳號）之間共通用戶帳號，統一帳號體系的需求，微信開放平臺（open.weixin.qq.com）提供了UnionID機制。開發者可通過OpenID來獲取用戶基本信息，而如果開發者擁有多個應用（移動應用、網站應用和公眾帳號，公眾帳號只有在被綁定到微信開放平臺帳號下后，才會獲取UnionID），可通過獲取用戶基本信息中的UnionID來區分用戶的唯一性，
1.獲取access_token
公眾號可以使用AppID和AppSecret調用本接口來獲取access_token;
接口調用：https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&appid=APPID&secret=APPSECRET
2.獲知微信服務器的IP地址列表：https://api.weixin.qq.com/cgi-bin/getcallbackip?access_token=ACCESS_TOKEN
自定義菜單
自定義菜單接口可實現多種類型按鈕，如下：
?1、click：點擊推事件
用戶點擊click類型按鈕后，微信服務器會通過消息接口推送消息類型為event 的結構給開發者（參考消息接口指南），并且帶上按鈕中開發者填寫的key值，開發者可以通過自定義的key值與用戶進行交互；
2、view：跳轉URL
用戶點擊view類型按鈕后，微信客戶端將會打開開發者在按鈕中填寫的網頁URL，可與網頁授權獲取用戶基本信息接口結合，獲得用戶基本信息。
3、scancode_push：掃碼推事件
4、scancode_waitmsg：掃碼推事件且彈出“消息接收中”提示框
5、pic_sysphoto：彈出系統拍照發圖
6、pic_photo_or_album：彈出拍照或者相冊發圖
7、pic_weixin：彈出微信相冊發圖器
8、location_select：彈出地理位置選擇器
9、media_id：下發消息（除文本消息）
10、view_limited：跳轉圖文消息URL
請注意，3到8的所有事件，僅支持微信iPhone5.4.1以上版本，和Android5.4以上版本的微信用戶，舊版本微信用戶點擊后將沒有回應，開發者也不能正常接收到事件推送。9和10，是專門給第三方平臺旗下未微信認證（具體而言，是資質認證未通過）的訂閱號準備的事件類型，它們是沒有事件推送的，能力相對受限，其他類型的公眾號不必使用。?
微信網頁授權如果用戶在微信客戶端中訪問第三方網頁，公眾號可以通過微信網頁授權機制，來獲取用戶基本信息，進而實現業務邏輯。
1.到公眾平臺官網中的開發者中心頁配置授權回調域名
snsapi_base 只獲取到用戶的openid snsapi_userinfo 用來獲取用戶的基本信息
關于網頁授權access_token和普通access_token的區別 1、微信網頁授權是通過OAuth2.0機制實現的，在用戶授權給公眾號后，公眾號可以獲取到一個網頁授權特有的接口調用憑證（網頁授權access_token），通過網頁授權access_token可以進行授權后接口調用，如獲取用戶基本信息； 2、其他微信接口，需要通過基礎支持中的“獲取access_token”接口來獲取到的普通access_token調用。 網頁授權獲取用戶基本信息也遵循UnionID機制，可通過獲取用戶基本信息中的unionid來區分用戶的唯一性 具體而言，網頁授權流程分為四步：
- 1?第一步：用戶同意授權，獲取code
- 2?第二步：通過code換取網頁授權access_token
- 3?第三步：刷新access_token（如果需要）
- 4?第四步：拉取用戶信息(需scope為 snsapi_userinfo)
- 5?附：檢驗授權憑證（access_token）是否有效
微信網頁授權自我總結：
首先打開OAuth 配置；確定Scopes是snsapi_base還是snsapi_userinfo？
1、以snsapi_base為scope發起的網頁授權，是用來獲取進入頁面的用戶的openid的，并且是靜默授權并自動跳轉到回調頁的。用戶感知的就是直接進入了回調頁（往往是業務頁面） 2、以snsapi_userinfo為scope發起的網頁授權，是用來獲取用戶的基本信息的。但這種授權需要用戶手動同意，并且由于用戶同意過，所以無須關注，就可在授權后獲取該用戶的基本信息。然后可通過
$wechat = app('wechat');$oauth = $wechat->oauth;
$wechat_user = $oauth->user();
實例來獲取用戶信息；從中拿去到對應微信的openid;
亦或者也可通過微信公眾平臺文檔中的接口逐步獲取code,access_token等
如果需要微信授權登錄的情況下，獲取到用戶的信息之后可繼續邏輯操作。比如：判斷用戶如果有登錄過就直接跳轉到網站首頁或者個人中心；若未登錄需授權登錄方可繼續下一步操作。
微信JS-SDK說明文檔
微信JS-SDK是微信公眾平臺面向網頁開發者提供的基于微信內的網頁開發工具包。網頁開發者可借助微信高效地使用拍照、選圖、語音、位置等手機系統的能力，同時可以直接使用微信分享、掃一掃、卡券、支付等微信特有的能力，為微信用戶提供更優質的網頁體驗。
JSSDK使用步驟
步驟一：綁定域名
步驟二：引入JS文件
步驟三：通過config接口注入權限驗證配置
步驟四：通過ready接口處理成功驗證
所有接口調用都必須在config接口獲得結果之后，config是一個客戶端的異步操作，所以如果需要在頁面加載時就調用相關接口，則須把相關接口放在ready函數中調用來確保正確執行。對于用戶觸發時才調用的接口，則可以直接調用，不需要放在ready函數中。判斷當前客戶端版本是否支持指定JS接口
wx.checkJsApi({jsApiList: ['chooseImage'], // 需要檢測的JS接口列表，所有JS接口列表見附錄2,success: function(res) {// 以鍵值對的形式返回，可用的api值true，不可用為false// 如：{"checkResult":{"chooseImage":true},"errMsg":"checkJsApi:ok"}} });獲取“分享給朋友”按鈕點擊狀態及自定義分享內容接口
wx.onMenuShareAppMessage({title: '', // 分享標題desc: '', // 分享描述link: '', // 分享鏈接imgUrl: '', // 分享圖標type: '', // 分享類型,music、video或link，不填默認為linkdataUrl: '', // 如果type是music或video，則要提供數據鏈接，默認為空success: function () { // 用戶確認分享后執行的回調函數},cancel: function () { // 用戶取消分享后執行的回調函數} });相關例子：
?
開發公眾號需要用到微信公眾平臺的服務號，不能是訂閱號；因為訂閱號可能會對一些權限有限制；從而不能使用到安正超給我們提供的laravel-wechat當中的一些方法和package.
在開發公眾號之前我們需要在公眾平臺的基本配置里面拿到AppId、AppSecret、URL、Token、AESkey.
1.安裝包文件：composer require?"overtrue/laravel-wechat:~3.0"
2.配置：
（1）注冊?ServiceProvider:
Overtrue\LaravelWechat\ServiceProvider::class,
（2）添加外觀到?config/app.php?中的?aliases?部分:
'EasyWeChat' => Overtrue\LaravelWechat\Facade::class,（3）創建配置文件：
php artisan vendor:publish
創建成功之后進入到config/wehcat.php文件當中找到appid,secret,token;然后在.env文件中進行配置
然后創建路由：
Route::any('/wechat',?'WechatController@serve');
這里用到any請求的原因是因為是通過get請求驗證的，但后面發送消息是通過post請求發送的。
創建控制器WechatController：
<?php namespace App\Http\Controllers; use Log; class WechatController extends Controller { /** * 處理微信的請求消息 * * @return string */ public function serve() { Log::info('request arrived.'); # 注意：Log 為 Laravel 組件，所以它記的日志去 Laravel 日志看，而不是 EasyWeChat 日志 $wechat = app('wechat'); $wechat->server->setMessageHandler(function($message){ return "歡迎關注 overtrue！"; }); Log::info('return response.'); return $wechat->server->serve();//這一句是對微信進行了驗證 } }最后把這一段代碼publish到與服務器同步，再對之前公眾平臺的基本配置進行提交，提交成功之后在接口權限中的網頁授權獲取用戶信息處點擊修改；把相對應的域名放上去，如果沒有放上去，它的權限也就獲取不到。
紅包接口調用：
在使用紅包請求功能的時候，注意mch_billno（商戶訂單號）這個參數；
商戶訂單號（每個訂單號必須唯一）
組成：?mch_id+yyyymmdd+10位一天內不能重復的數字。
微信支付：
用easywechat來開發微信支付功能，步驟如下：
?
一，需要有一個商品下單頁面，頁面上有你的商品的信息，還要有購買數量，和一個購買按鈕。
? ? ? ? 用戶在這個頁面瀏覽商品信息的時候，可以選擇購買的數量，然后點擊提交進入下一個頁面。
? ? ? ?（這個頁面，跟淘寶的商品購買頁面一樣。）
?
二，創建一個頁面，接收上面一步提交來的數據，然后做如下計算 。
?
? ? ? ?1，根據商品ID或是提交來的商品信息，生成商品的參數數組。
?
?
[php]?view plain?copy?
? ? ? ? 2，接下來，生成商品對象。
?
?
?
[php]?view plain?copy?
? ? ? ? 3，再接下來，要進行調用前計算了。
?
?
?
[php]?view plain?copy??
?
? ? ? ? 4，就快進入正題，但是，還沒完。還要取得一個數據。
?
?
[php]?view plain?copy??
? ? ? ? 5，上面獲得的$js 和 $config數據，要在頁面里顯示出來。
? ? ? ? ? ? ? ? 注意，上面幾步都不涉及顯示，只是在生成頁面顯示所需要的數據。
? ? ? ? ? ? ? ? 現在才需要把這些顯示在頁面上。
?
?
[php]?view plain?copy?
? ? ? ? 沒錯，只需要修改這些。
?
?
? ? ? ? 再來理一個，第二步里，這個頁面需要顯示一個確認信息，比如商品的名稱，和支付的總金額。
? ? ? ? 頁面上應該有一個按鈕，用來觸發支付（.btn-do-it）。
? ? ? ? 頁面里的js就是第5步里要顯示的內容。
?
?
? ? ? ? 總結:
? ? ? ? 第一步，商品信息頁面，用戶選擇購買數據，點購買，提交到第二步的確認頁面。
? ? ? ? 第二步的確認頁面，根據商品信息，和微信配置信息，生成必要的支付數據，并顯示購買確認信息，和一個支付按鈕，
? ? ? ? 用戶點擊支付按鈕，發起支付。
? ? ? ? 支付完成，提示用戶，或轉到相應頁面。
? ? ? ? 微信的開發團隊提醒我們，請以微信的推送信息為準來處理訂單，不然有可能人財兩空。
product.html
?
?
[html]?view plain?copy??
payment.php
?
?
[php]?view plain?copy??
這些是偽代碼，payment.php并沒有對product.html傳來的商品信息做處理。
其實只要看payment.php文件應該知道怎么做了。
?
其它就兩點。a，獲取$config，b， 自己寫wx.chooseWXPay。
其它的看easywechat文檔就行了。
總結
- 上一篇： 零基础新手学习算法Leetcode刷题指
- 下一篇： 网站域名在微信端被封禁了怎么办？这样几步