微信小程序Ⅴ [獲取登陸用戶信息，重點openID(詳解)]

♩ 背景

• 其實這篇文章幾個月前就寫完了，可是這段時間，微信小程序官方文檔有了更新，同事在我本身的實際操做過程當中，發現以前寫的過於繁雜，因此如今進行簡化梳理，歡迎指摘.

• 語言框架：ThinkPHP3.2.3
• 更新時間：2018-07-10
• 也能夠閱讀近期整理的一篇文章：小程序 報錯 errcode: 40029

♪ 步驟梳理

• 下面是小程序官方提供流程圖：
  

♫ 具體實現

1、登陸獲取用戶惟一信息 openID/unionID

• 此方式，只須要兩步操做便可，可是須要小程序端和項目服務器的代碼配合進行操做，建議參考下官方說明 >>> wx.login(OBJECT)

步驟梳理：
> (1).獲取臨時登陸憑證—— code
> (2).將上述得到的 code 經過request 請求發送給代碼服務器
> (3).請求接口地址：https://api.weixin.qq.com/sns/jscode2session?appid=APPID&secret=SECRET&js_code=JSCODE&grant_type=authorization_code
	> ;# 成功則會返回咱們所須要的 "openID/unionID"

• 具體實現：

①. 服務端代碼處理

• 後面將會進行源代碼的上傳，具體代碼在 "WxController.class.php" 中，可做參考
  

②.小程序端 js編碼

• 我在此處設置了一個 "button" 按鈕，經過點擊而調用其中的方法邏輯，其實在實際開發中，自行將其中的代碼提取調用就可；

/** * 獲取用戶惟一憑證 */
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) { 
 
   
            //回調處理
            console.log('getOpenID-OK!');
            console.log(res.data);
          },
          fail: function(error) { 
 
   
            console.log(error);
          }
        })
      },
      fail: function() { 
 
   
        console('登陸獲取Code失敗！');
      }
    })
  },

③. 運行效果以下：

• 注意觀察個人數據獲取狀況，你會發現其中包含了 "unionID",這是由於我在微信開放平臺進行了綁定操做，若是你沒有這樣的操做，那麼就不會有這個數據
  

提示：
UnionID 只在知足必定條件的狀況下返回。具體參看 >>> UnionID機制說明
注意配置信息的填寫，須要正確填寫本身的數據哦，應該歧義不大

2、新方法獲取用戶信息

• 若是你接觸小程序時間較早，應該會知道，微信小程序官方以前是使用接口 wx.getUserInfo() 方法進行操做的，可是由於近期版本更新,如今有了新的方法，推薦閱讀文檔瞭解， wx.getUserInfo(OBJECT) 接口獲取用戶信息

①. 第一步，頁面使用button引導

官方文檔已作註明：請使用 <button open-type="getUserInfo"></button> 引導用戶主動進行受權操做

• 最簡單的使用方式就是，使用頁面中的 Button 進行引導操做便可：

<button open-type="getUserInfo" lang="zh_CN" bindgetuserinfo="bingGetUserInfo">獲取用戶信息</button>

②. 第二步，js文件進行綁定事件處理

• 在對應的 js文件中，建立相應的方法 bingGetUserInfo()：

/** * 獲取用戶信息 */
  bingGetUserInfo:function(e){ 
 
   
  console.log(e.detail);
  },

• 上述方法執行後的打印數據截圖以下：
  

③. 第三步，後續處理

• 根據上一步獲得的 e.detail 打印出的對象數據，直接進行提取所須要的數據（好比微信暱稱和頭像連接、性別等）；
• 而後經過 wx.request() 存儲到本身的服務器中便可；

注意（後面步驟，可繼續也可中止，自行決定！）：

> 其實，獲取當前登陸用戶的 "openID/unionID" 信息在前面"(一)"已經能夠簡單的得到了;
> 可是若是想繼續當前的步驟的話：

• 咱們徹底能夠直接經過得到的 "encryptedData"，而後對其進行 算法對稱解密操做，就能夠獲取到用戶的 openID/unionID 這些敏感數據，而且文檔中也提供了不一樣語言的示例代碼

步驟梳理：
1).獲取臨時登陸憑證（code）
2).根據上一步中微信端傳來的參數 "code"，在本地服務器中請求微信的接口地址，從而獲得"session_key"
	>接口地址爲："https://api.weixin.qq.com/sns/jscode2session?appid=APPID&secret=SECRET&js_code=JSCODE&grant_type=authorization_code"
3).服務端獲取數據簽名加密信息

④. 進一步的實現處理

• 小程序 js代碼的補充擴展，其實仍是前面的 bingGetUserInfo()方法：
  

提示：

以個人 PHP 代碼爲例，調用 WXBizDataCryptController 類的 wxDecrypt() 方法，傳入前面所得到的全部參數便可

• 附一張數據反饋截圖：
  

提示：
> 此時只要進行數據轉化便可獲得咱們所須要的 "openid/unionid" 重要信息;
> 好比，我須要用到此信息去數據庫比對該用戶的業務信息等;
> 固然，我建議的是在服務端獲取到數據後就與本身的數據庫進行匹配處理便可

♬ 附錄

♦ 推薦參考：

• 微信小程序登陸數據解密以及狀態維持
• 微信小程序登陸邏輯整理
• 微信小程序：全局變量和本地存儲何時用那個

♥ 源碼下載

▽ CSDN-源碼連接 歡迎指摘

本文同步分享在 博客「moTzxx」（CSDN）。
若有侵權，請聯繫 support@oschina.cn 刪除。
本文參與「OSC源創計劃」，歡迎正在閱讀的你也加入，一塊兒分享。