微信小程序獲取微信綁定授權手機號getPhoneNumber全流程及出現手機號帶*號問題詳解

 

微信小程序文檔中給出如下示例

獲取微信用戶綁定的手機號，需先調用login接口。

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

注意：目前該接口針對非個人開發者，且完成了認證的小程序開放。需謹慎使用，若用戶舉報較多或被發現在不必要場景下使用，微信有權永久回收該小程序的該接口權限。

使用方法

需要將<button>組件的open-type值設置為getPhoneNumber，當用戶點擊並同意之后，可以通過bindgetphonenumber事件回調獲取到微信服務器返回的加密數據， 然后在第三方服務端結合session_key以及app_id進行解密獲取手機號。

注意

在回調中調用wx.login登錄，可能會刷新登錄態。此時服務器使用code換取的sessionKey不是加密時使用的sessionKey，導致解密失敗。建議開發者提前進行login;或者在回調中先使用checkSession進行登錄態檢查，避免login刷新登錄態。

例子

<button open-type="getPhoneNumber" bindgetphonenumber="getPhoneNumber"> </button>

 

1.  
   Page({
2.  
   getPhoneNumber: function(e) {
3.  
   console. log(e.detail.errMsg)
4.  
   console. log(e.detail.iv)
5.  
   console. log(e.detail.encryptedData)
6.  
   }
7.  
   })

返回參數說明

參數	類型	說明	最低版本
encryptedData	String	包括敏感數據在內的完整用戶信息的加密數據，詳細見加密數據解密算法
iv	String	加密算法的初始向量，詳細見加密數據解密算法
cloudID	String	敏感數據對應的雲 ID，開通雲開發的小程序才會返回，可通過雲調用直接獲取開放數據，詳細見雲調用直接獲取開放數據	2.8.0

敏感數據有兩種獲取方式，一是使用 加密數據解密算法 將 encryptedData 在開發者后台解密，二是使用雲調用直接通過 cloudID 獲取開放數據。

獲取得到的開放數據為以下 json 結構：

1.  
   {
2.  
   "phoneNumber": "13580006666",
3.  
   "purePhoneNumber": "13580006666",
4.  
   "countryCode": "86",
5.  
   "watermark":
6.  
   {
7.  
   "appid" :"APPID",
8.  
   "timestamp" :TIMESTAMP
9.  
   }
10.  
    }

 

但是到這里你會發現其實根本不詳盡尤其是解密和錯誤代碼方面

 

首先如手冊所述，解析加密數據包不太明白我給大家貼個示例

1.  
   getPhoneNumber: function (e) {
2.  
    
3.  
   console.log(e.detail.iv);
4.  
    
5.  
   console.log(e.detail.encryptedData);
6.  
    
7.  
   wx.login({
8.  
    
9.  
   success: res => {
10.  
     
11.  
    console.log(res.code);
12.  
     
13.  
    wx.request({
14.  
     
15.  
    url: 'https://你的解密地址',
16.  
     
17.  
    data: {
18.  
     
19.  
    'encryptedData': encodeURIComponent(e.detail.encryptedData),
20.  
     
21.  
    'iv': e.detail.iv,
22.  
     
23.  
    'code': res.code
24.  
     
25.  
    },
26.  
     
27.  
    method: 'GET', // OPTIONS, GET, HEAD, POST, PUT, DELETE, TRACE, CONNECT
28.  
     
29.  
    header: {
30.  
     
31.  
    'content-type': 'application/json'
32.  
     
33.  
    }, // 設置請求的 header
34.  
     
35.  
    success: function (res) {
36.  
     
37.  
    if (res.status == 1) { //我后台設置的返回值為1是正確
38.  
     
39.  
    //存入緩存即可
40.  
     
41.  
    wx.setStorageSync( 'phone', res.phone);
42.  
     
43.  
    }
44.  
     
45.  
    },
46.  
     
47.  
    fail: function (err) {
48.  
     
49.  
    console.log(err);
50.  
     
51.  
    }
52.  
     
53.  
    })
54.  
     
55.  
    }
56.  
     
57.  
    })
58.  
     
59.  
    }

 

后台解析代碼就是利用傳過去的三個值，來進行解析每個語言解析方式不同請下載樣例

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

 

注意解析方式跟解析用戶信息是一個解析方式！！！！

 

在這里小編遇到了一個問題解析回的形式雖然跟文檔相同但是！

卻是這個樣子的數據：

 

這樣的情況其實是因為開發的基礎庫版庫過低造成的

配置地點在這里：

 

小編修改為v1.9.1之后呈現形式就如同官網手冊 一樣了

 

1.  
   {
2.  
   "phoneNumber": "13580006666",
3.  
   "purePhoneNumber": "13580006666",
4.  
   "countryCode": "86",
5.  
   "watermark":
6.  
   {
7.  
   "appid" :"APPID",
8.  
   "timestamp" :TIMESTAMP
9.  
   }
10.  
    }

至此獲取微信綁定的用戶手機號完成！

 

還有一點要注意你的開發版本上去了，但是用戶不一定更新了

所以微信后台有這樣一個配置~

 

由於發文時間較遠，我只進行了死鏈接的替換。小程序早就出了提示用戶版本更新的代碼，有需要的小伙伴可以去手冊查閱。

地址：https://developers.weixin.qq.com/miniprogram/dev/api/base/update/UpdateManager.html

剩下的問題歡迎在下面評論，第一次寫博客希望對大家有幫助！！！

 

我在網上已經看到幾篇轉載的，個人之作轉載請注明出處！

csdn博客-大國的博客

原文地址：https://blog.csdn.net/weixin_41818665/article/details/79509792