微信小程序获取手机号授权怎么实现

2022-10-12 12:25:39 小程序开发

微信小程序获取手机号授权是常用的小程序开放能力之一，对小程序制作开发人员来说怎么实现该功能呢？

要想获取微信用户绑定的手机号，需要先调用wx.login接口。而且因为需要用户主动触发才能发起获取手机号接口，所以该功能不由API来调用，需用button组件的点击来触发。

使用方法：

将button组件open-type的值设置为getPhoneNumber，当用户点击并同意之后，可以通过 bindgetphonenumber 事件回调获取到微信服务器返回的加密数据，然后在第三方服务端结合 session_key 以及 app_id 进行解密获取手机号。

注意事项：

在回调中调用 wx.login 登录，可能会刷新登录态。此时服务器使用 code 换取的 sessionKey 不是加密时使用的 sessionKey，导致解密失败。建议开发者提前进行 login；或者在回调中先使用 checkSession 进行登录态检查，避免 login 刷新登录态。

代码示例如下：

JS内getPhoneNumbe组件函数（该事件中最重要的就是在wx.login登录后发起接口请求），这里需要配置参数来给接口：

这些是必不可少的参数，这些齐备才能算一个合法的请求。

appid: “你的小程序APPID”,
secret: “你的小程序appsecret”,
code: res.code,
encryptedData: telObj,
iv: ivObj

//通过绑定手机号登录
　　getPhoneNumber: function (e) {
var ivObj = e.detail.iv
var telObj = e.detail.encryptedData
var codeObj = “”;
var that = this;
//——执行Login———
wx.login({
success: res => {
console.log(‘code转换’, res.code);

　　　　　　//用code传给服务器调换session_key
wx.request({
url: ‘https://你的接口文件路径’, //接口地址
data: {
appid: “你的小程序APPID”,
secret: “你的小程序appsecret”,
code: res.code,
encryptedData: telObj,
iv: ivObj
},
success: function (res) {
phoneObj = res.data.phoneNumber;
console.log(“手机号=”, phoneObj)
wx.setStorage({ //存储数据并准备发送给下一页使用
key: “phoneObj”,
data: res.data.phoneNumber,
})
}
})

//—————–是否授权，授权通过进入主页面，授权拒绝则停留在登陆界面
if (e.detail.errMsg == ‘getPhoneNumber:user deny’) { //用户点击拒绝
wx.navigateTo({
url: ‘../index/index’,
})
} else { //允许授权执行跳转
wx.navigateTo({
url: ‘../test/test’,
})
}
}
});
},