? 背景
- 其實這篇文章幾個月前就寫完了，但是這段時間矛渴，微信小程序官方文檔有了更新椎扬，同事在我自己的實際操作過程中，發(fā)現(xiàn)之前寫的過于繁雜具温，所以現(xiàn)在進行簡化梳理蚕涤，歡迎指摘.
- 語言框架：ThinkPHP3.2.3
- 更新時間：2018-07-10
- 也可以閱讀近期整理的一篇文章：小程序 報錯 errcode: 40029
? 步驟梳理
-
下面是小程序官方提供流程圖：
? 具體實現(xiàn)
一、登錄獲取用戶唯一信息 openID/unionID
- 此方式铣猩，只需要兩步操作即可揖铜，但是需要小程序端和項目服務器的代碼配合進行操作，建議參考下官方說明 wx.login(OBJECT)
步驟梳理：
> (1).獲取臨時登錄憑證—— code
> (2).將上述獲得的 code 通過request 請求發(fā)送給代碼服務器
> (3).請求接口地址：https://api.weixin.qq.com/sns/jscode2session?appid=APPID&secret=SECRET&js_code=JSCODE&grant_type=authorization_code
> ;# 成功則會返回我們所需要的 "openID/unionID"
- 具體實現(xiàn)：
①. 服務端代碼處理
- 后面將會進行源代碼的上傳达皿，具體代碼在
"WxController.class.php"中天吓，可作參考
②.小程序端 js編碼
- 我在此處設置了一個
"button"按鈕，通過點擊而調(diào)用其中的方法邏輯峦椰，其實在實際開發(fā)中龄寞，自行將其中的代碼提取調(diào)用就可；
/**
* 獲取用戶唯一憑證
*/
bingGetOpenID: function() {
wx.login({
success: function(data) {
console.log('獲取登錄 Code：' + data.code)
var postData = {
code: data.code
};
wx.request({
url: 'http://fetowNew.com/wxApi/wx/getOpenID',//注意改成自己的服務器請求地址哦汤功！
data: postData,
method: 'POST', // OPTIONS, GET, HEAD, POST, PUT, DELETE, TRACE, CONNECT
header: {
'content-type': 'application/x-www-form-urlencoded;charset=utf-8',
},
success: function(res) {
//回調(diào)處理
console.log('getOpenID-OK!');
console.log(res.data);
},
fail: function(error) {
console.log(error);
}
})
},
fail: function() {
console('登錄獲取Code失斘镆亍！');
}
})
},
③. 運行效果如下：
- 注意觀察我的數(shù)據(jù)獲取情況，你會發(fā)現(xiàn)其中包含了
"unionID",這是因為我在微信開放平臺進行了綁定操作拂封，如果你沒有這樣的操作，那么就不會有這個數(shù)據(jù)
提示：
UnionID只在滿足一定條件的情況下返回鹦蠕。具體參看 UnionID機制說明
注意配置信息的填寫冒签，需要正確填寫自己的數(shù)據(jù)哦，應該歧義不大
二钟病、新方法獲取用戶信息
- 如果你接觸小程序時間較早萧恕，應該會知道，微信小程序官方之前是使用接口
wx.getUserInfo()方法進行操作的肠阱，但是因為近期版本更新,現(xiàn)在有了新的方法票唆，推薦閱讀文檔了解， wx.getUserInfo(OBJECT) 接口獲取用戶信息
①. 第一步屹徘，頁面使用button引導
官方文檔已做注明：
請使用 <button open-type="getUserInfo"></button> 引導用戶主動進行授權(quán)操作
- 最簡單的使用方式就是走趋，使用頁面中的
Button進行引導操作即可：
<button open-type="getUserInfo" lang="zh_CN" bindgetuserinfo="bingGetUserInfo">獲取用戶信息</button>
②. 第二步，js文件進行綁定事件處理
- 在對應的
js文件中噪伊，創(chuàng)建相應的方法bingGetUserInfo()：
/**
* 獲取用戶信息
*/
bingGetUserInfo:function(e){
console.log(e.detail);
},
-
上述方法執(zhí)行后的打印數(shù)據(jù)截圖如下：
③. 第三步簿煌，后續(xù)處理
- 根據(jù)上一步得到的
e.detail打印出的對象數(shù)據(jù)，直接進行提取所需要的數(shù)據(jù)（比如微信昵稱和頭像鏈接鉴吹、性別等）姨伟； - 然后通過
wx.request()存儲到自己的服務器中即可；
注意（后面步驟豆励，可繼續(xù)也可停止夺荒，自行決定！）：
> 其實良蒸，獲取當前登錄用戶的 "openID/unionID" 信息在前面"(一)"已經(jīng)可以簡單的獲得了;
> 但是如果想繼續(xù)當前的步驟的話：
- 我們完全可以直接通過獲得的
"encryptedData"技扼，然后對其進行 算法對稱解密操作，就可以獲取到用戶的openID/unionID這些敏感數(shù)據(jù)嫩痰，并且文檔中也提供了不同語言的示例代碼
步驟梳理：
1).獲取臨時登錄憑證（code）
2).根據(jù)上一步中微信端傳來的參數(shù) "code"淮摔，在本地服務器中請求微信的接口地址，從而得到"session_key"
>接口地址為："https://api.weixin.qq.com/sns/jscode2session?appid=APPID&secret=SECRET&js_code=JSCODE&grant_type=authorization_code"
3).服務端獲取數(shù)據(jù)簽名加密信息
④. 進一步的實現(xiàn)處理
- 小程序
js代碼的補充擴展始赎，其實還是前面的bingGetUserInfo()方法：
提示：
以我的
PHP代碼為例和橙，調(diào)用WXBizDataCryptController類的wxDecrypt()方法，傳入前面所獲得的所有參數(shù)即可
-
附一張數(shù)據(jù)反饋截圖：
提示：
> 此時只要進行數(shù)據(jù)轉(zhuǎn)化即可得到我們所需要的 "openid/unionid" 重要信息;
> 比如造垛，我需要用到此信息去數(shù)據(jù)庫比對該用戶的業(yè)務信息等;
> 當然魔招，我建議的是在服務端獲取到數(shù)據(jù)后就與自己的數(shù)據(jù)庫進行匹配處理即可
