微信小程序開發(fā)之獲取用戶手機號碼(php接口解密)

更新時間：2020年05月17日 16:33:10 作者：逍遙云天

這篇文章主要介紹了微信小程序開發(fā)之獲取用戶手機號碼,文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值，需要的朋友們下面隨著小編來一起學習學習吧

后邊要做一個微信小程序，并要能獲取用戶微信綁定的手機號碼。而小程序開發(fā)文檔上邊提供的獲取手機號碼的接口（getPhoneNumber()）返回的是密文，需要服務器端進行解密，但是官方提供的開發(fā)文檔一如既往的亂，如果沒有對小程序開發(fā)文檔有一個整體的了解，搞懂解密流程還是有點難的。這里把小程序從請求用戶授權獲取手機號碼直至獲取到手機號碼明文的整個流程串了起來，方便迅速了解,如下：

一. 前端相關操作：

1. 請求用戶授權獲取手機號碼:

因為需要用戶主動觸發(fā)才能發(fā)起獲取手機號接口，所以該功能不由 API 來調用，需用<button>組件的點擊來觸發(fā)，如下：

wxml:

<button wx:if="{{!phone}}" open-type="getPhoneNumber" bindgetphonenumber="getPhoneNumber"> 獲取手機號碼</button>

js:

Page({
 getPhoneNumber: function(e) {　　　　
 if(e.detail.errMsg == "getPhoneNumber:fail user deny") return;　　 //用戶允許授權 　　
 console.log("lv", e.detail.iv); //包括敏感數(shù)據在內的完整用戶信息的加密數(shù)據,需要解密 　　
 console.log(e.detail.encryptedData); //加密算法的初始向量，解密需要用到 　　
 ......
 }
})

2. 訪問小程序登錄接口:

小程序調用wx.login()獲取臨時登錄憑證code,并傳到開發(fā)者服務器。

Page({ 
 getPhoneNumber: function(e) { 
 console.log(e.detail.errMsg) 
 console.log(e.detail.iv) //包括敏感數(shù)據在內的完整用戶信息的加密數(shù)據,需要解密
 console.log(e.detail.encryptedData) //加密算法的初始向量，解密需要用到
 wx.login({
  success: res => {
  if(res.code){
   console.log(res.code)
  }
  }
 })
 } 
})

3. 訪問騰訊服務器的登錄憑證校驗接口:

注：官方推薦放到服務器端進行，這里為了方便，就放在前端請求了。

這里要注意傳入參數(shù)：

appid		小程序唯一標識
secret		小程序的 app secret
js_code		登錄時獲取的 code
grant_type		填寫為 authorization_code

//2. 訪問登錄憑證校驗接口獲取session_key
 wx.request({
  url: "https://api.weixin.qq.com/sns/jscode2session",
  data: {
  'appid': "xxxxxxxx",
  'secret': "xxxxxxxx",
  'js_code': res.code,
  'grant_type': "authorization_code"
  },
  method: 'GET', // OPTIONS, GET, HEAD, POST, PUT, DELETE, TRACE, CONNECT
  header: {
  'content-type': 'application/json'
  }, // 設置請求的 header
  success: function(data) {
  console.log("data", data.data.session_key)
  },
  fail: function(err) {
  console.log(err);
  }
 })

4. 自己的服務器端進行解密

注：解密接口可以使用騰訊官方的demo進行改造，具體改造會在后面說明。

//3. 解密
 wx.request({
  url: 'http://xxxxx.com/demo/demo.php',//騰訊官方demo改造的接口頁面
  data: {
  'encryptedData': encodeURIComponent(e.detail.encryptedData),//需要進行編碼
  'iv': e.detail.iv,
  'session_key': data.data.session_key
  },
  method: 'GET', // OPTIONS, GET, HEAD, POST, PUT, DELETE, TRACE, CONNECT
  header: {
  'content-type': 'application/json'
  }, // 設置請求的 header
  success: function(data2) {
  console.log(data2.data.phoneNumber)
  if(data2.statusCode == 200) { 
   self.setData({
   phone: data2.data.phoneNumber
   })
  }
  },
  fail: function(err) {
  console.log(err);
  }
 })

js部分整體代碼如下：

getPhoneNumber: function (e) {
 if (e.detail.errMsg == "getPhoneNumber:fail user deny") return;
 //用戶允許授權
 console.log("lv", e.detail.iv);
 console.log(e.detail.encryptedData);
 wx.showLoading()
 var self=this
 //1. 調用登錄接口獲取臨時登錄code
 wx.login({
 success: res => {
 if(res.code){
  //2. 訪問登錄憑證校驗接口獲取session_key、openid
  wx.request({
  url: "https://api.weixin.qq.com/sns/jscode2session",
  data: {
  'appid': "wxcc41e47562b08129",
  'secret': "50e4379d67a6860d18157c53dc6ac3c2",
  'js_code': res.code,
  'grant_type': "authorization_code"
  },
  method: 'GET', // OPTIONS, GET, HEAD, POST, PUT, DELETE, TRACE, CONNECT
  header: {
  'content-type': 'application/json'
  }, // 設置請求的 header
  success: function (data) {
  console.log("data", data)
  if(data.statusCode==200){
   //3. 解密
  wx.request({
   url: 'http://qdy8.gotoip4.com/demo/demo.php',
   data: {
   'encryptedData': e.detail.encryptedData,
   'iv': e.detail.iv,
   'session_key': data.data.session_key
   },
   method: 'GET', // OPTIONS, GET, HEAD, POST, PUT, DELETE, TRACE, CONNECT
   header: {
   'content-type': 'application/json'
   }, // 設置請求的 header
   success: function (data2) {
   wx.hideLoading()
   console.log(data2.data.phoneNumber)
   if (data2.statusCode == 200 && data2.data.phoneNumber) {
   self.setData({ 
   phone: data2.data.phoneNumber
   })
   }
   },
   fail: function (err) {
   console.log(err);
   }
  })
  }
  },
  fail: function (err) {
  console.log(err);
  }
  }) 
 }
  
 }
 })
 }

二. 后端接口：

微信官方提供了多種編程語言的示例代碼（示例代碼）。每種語言類型的接口名字均一致，調用方式可以參照示例。

如果只是學習研究，可以買個經濟型的虛擬主機，一年才幾十塊錢，不過這種虛擬主機以php居多，所以這里以php為例進行改造，接收前端請求。

官方demo下載后結構如下：

對demo.php進行改造：

<?php

include_once "wxBizDataCrypt.php";

/**
 * sessionKey/encryptedData/iv參數(shù)均從url中獲取，并賦給相應變量
 */
$appid = 'xxxxxxxx';
$sessionKey = $_REQUEST['session_key'];
$encryptedData=$_REQUEST['encryptedData'];
$iv = $_REQUEST['iv'];

$pc = new WXBizDataCrypt($appid, $sessionKey);
$errCode = $pc->decryptData($encryptedData, $iv, $data );

if ($errCode == 0) {
 print($data . "\n");
} else {
 print($errCode . "\n");
}
?>

將php的三個demo文件上傳虛擬主機：