uni-app vue3下 微信小程序手机号授权返回参数和文档不符
uni-app vue3下 微信小程序手机号授权返回参数和文档不符
| 类别 | 信息 |
|---|---|
| 产品分类 | uniapp/小程序/微信 |
| PC开发环境 | Windows |
| 操作系统版本 | win10 |
| HBuilderX类型 | 正式 |
| HBuilderX版本 | 3.99 |
| 项目创建方式 | HBuilderX |
示例代码：
<button open-type="getPhoneNumber" @getphonenumber="getPhoneNumber">使用手机号码登录</button>getPhoneNumber: function(e) {
console.log(e)
}操作步骤：
- 复制代码 获取手机号
预期结果：
getPhoneNumber (e) {
console.log(e.detail.code) // 动态令牌
console.log(e.detail.errMsg) // 回调信息（成功失败都会返回）
console.log(e.detail.errno) // 错误码（失败时返回）
}实际结果：
getPhoneNumber (e) {
console.log(e.code) // 动态令牌
console.log(e.errMsg) // 回调信息（成功失败都会返回）
console.log(e.errno) // 错误码（失败时返回）
} bug描述： vue3版本开发，遇到小程序获取手机号时 按照微信开放文档 应当返回的是
getPhoneNumber (e) {
console.log(e.detail.code) // 动态令牌
console.log(e.detail.errMsg) // 回调信息（成功失败都会返回）
console.log(e.detail.errno) // 错误码（失败时返回）
}但是实际返回的时候是
getPhoneNumber (e) {
console.log(e.code) // 动态令牌
console.log(e.errMsg) // 回调信息（成功失败都会返回）
console.log(e.errno) // 错误码（失败时返回）
} 之前用vue2版本开发的小程序没有发生问题，新开发的换的vue3模式开发的，遇到的问题
5 回复
在使用 uni-app 开发微信小程序时，如果你在 Vue3 环境下进行手机号授权，并且发现返回的参数与官方文档不符，可能是以下几个原因导致的：
1. 检查 uni.login 和 uni.getUserInfo 的使用
微信小程序的手机号授权通常需要结合 uni.login 和 uni.getUserInfo 来实现。确保你正确使用了这两个 API。
uni.login({
provider: 'weixin',
success: function (loginRes) {
// 获取登录凭证
const code = loginRes.code;
// 获取用户信息
uni.getUserInfo({
provider: 'weixin',
success: function (userInfoRes) {
// 获取用户信息
const userInfo = userInfoRes.userInfo;
// 获取手机号
uni.getPhoneNumber({
success: function (phoneRes) {
// 获取加密数据
const encryptedData = phoneRes.encryptedData;
const iv = phoneRes.iv;
// 解密手机号
// 需要将 encryptedData 和 iv 发送到服务器进行解密
},
fail: function (err) {
console.error('获取手机号失败', err);
}
});
},
fail: function (err) {
console.error('获取用户信息失败', err);
}
});
},
fail: function (err) {
console.error('登录失败', err);
}
});2. 检查 uni.getPhoneNumber 的返回参数
uni.getPhoneNumber 的返回参数通常包括 encryptedData 和 iv，这两个参数需要发送到服务器进行解密，才能获取到用户的手机号。
{
"encryptedData": "xxxxxx",
"iv": "xxxxxx"
}如果你发现返回的参数与文档不符，可能是以下原因：
- 微信小程序版本问题：确保你使用的微信小程序基础库版本是最新的，或者至少是支持
getPhoneNumber的版本。 - uni-app 版本问题：确保你使用的
uni-app版本是最新的，或者至少是支持Vue3的版本。
3. 检查服务器端解密逻辑
获取到 encryptedData 和 iv 后，需要在服务器端进行解密。确保服务器端的解密逻辑正确，并且使用了正确的 session_key。
const crypto = require('crypto');
const WXBizDataCrypt = require('./WXBizDataCrypt');
const appId = 'your-app-id';
const sessionKey = 'user-session-key';
const encryptedData = 'encrypted-data-from-client';
const iv = 'iv-from-client';
const pc = new WXBizDataCrypt(appId, sessionKey);
const data = pc.decryptData(encryptedData, iv);
console.log('解密后的数据: ', data);