小程序中wx.login与获取用户信息调用的时机
原创小程序中wx.login与获取用户信息调用的时机
原创
笔者最近在开发小程序，笔者直接嵌套的方式结合wx.login和getPhoneNumber,打算这样获取用户手机号：
getPhoneNumber(e){
console.log(this)
if(e.detail.errMsg.includes('ok')){
wx.login({
success:function(res){
let { encryptedData, iv } = e.detail;
console.log('code：', res.code);
console.log('encryptedData：', encryptedData);
console.log('iv：', iv);
// return
Req({
url: apiList.getPhone,
type: 'POST',
data: {
encryptedData,
iv,
js_code: this.data.code,
appIdCode: '1003'
},
success: (res) =>{
console.log(res);
let { openid, purePhoneNumber } = res;
console.log(openid, purePhoneNumber);
if (!openid) {
}
wx.setStorageSync("openid", openid);
wx.setStorageSync("phone", purePhoneNumber);
if(this.data.back){
wx.redirectTo({
url: this.data.back
})
}else{
wx.navigateBack({
delta: 1
})
}
}
})
}
})
}else{
console.log("用户不同意")
}
}阅读上面源码，在getPhoneNumber函数中，我们先调用了wx.login，从而获取code，然后再getPhoneNumber的参数中回去iv和加密信息，将其发送给后端解密，此时有时会报错，这里微信文档已经解释的很清楚了。
注意
在回调中调用 wx.login 登录，可能会刷新登录态。此时服务器使用 code 换取的 sessionKey 不是加密时使用的 sessionKey，导致解密失败。建议开发者提前进行
login；或者在回调中先使用checkSession进行登录态检查，避免login刷新登录态。
所有后面改正，提前调用login，也就是页面onload时进行login，改进代码如下：
import { apiList,Req } from "../../utils/request";
Page({
data:{
code:null,
back:null
},
onLoad: function (options) {
console.log("onload:", options);
if (options.back){
this.setData({
back: options.back
})
}
wx.login({
success: (res) =>{
let { code } = res;
this.setData({code})
}
})
},
getPhoneNumber(e){
console.log(this)
if(e.detail.errMsg.includes('ok')){
let { encryptedData, iv } = e.detail;
console.log('code：', this.data.code);
console.log('encryptedData：', encryptedData);
console.log('iv：', iv);
// return
Req({
url: apiList.getPhone,
type: 'POST',
data: {
encryptedData,
iv,
js_code: this.data.code,
appIdCode: '1003'
},
success: (res) =>{
console.log(res);
let { openid, purePhoneNumber } = res;
console.log(openid, purePhoneNumber);
if (!openid) {
}
wx.setStorageSync("openid", openid);
wx.setStorageSync("phone", purePhoneNumber);
if(this.data.back){
wx.redirectTo({
url: this.data.back
})
}else{
wx.navigateBack({
delta: 1
})
}
}
})
}else{
console.log("用户不同意")
}
}
})此时code的获取时机是早于获取电话号码的，当用加密信息去解密时，code所对应的解密信息和加密信息是配套的。
如果是第一种方式，先获取了加密信息，在去login的，此时解密信息已经更新了，拿着加密信息去解密就会报错。
每次login都会更新解密信息，并且解密信息会在微信服务器保存一段时间，我们要确保得到的加密信息是在登录之后获得的，或者这样说，我们获得的加密信息，一应要用上次login时对应的解密信息解密才能成功。
以上便是笔者在获取用户电话号码时出现的错误以及解决方法，希望对你有所帮助。
参看信息：https://developers.weixin.qq.com/miniprogram/dev/framework/open-ability/getPhoneNumber.html
原创声明：本文系作者授权腾讯云开发者社区发表，未经许可，不得转载。
如有侵权，请联系 cloudcommunity@tencent.com 删除。
原创声明：本文系作者授权腾讯云开发者社区发表，未经许可，不得转载。
如有侵权，请联系 cloudcommunity@tencent.com 删除。
腾讯云开发者
