uniapp微信小程序授权获取用户信息

### 实现 UniApp 中微信小程序授权以获取用户信息的方法 在 UniApp 开发环境中，为了实现微信小程序的授权并成功获取用户信息（包括手机号），需要遵循特定的工作流来确保操作顺利进行。此过程不仅涉及前端代码逻辑的设计，还涉及到后端对于接收到的数据处理方式。 #### 前置准备 确保已经在微信公众平台的小程序管理后台完成了必要的设置工作，比如配置服务器域名以及开启相应的接口权限等[^2]。这些准备工作是后续能够正常调用微信开放能力的基础。 #### 获取用户基本信息 针对新版 uni-app 微信小程序，在尝试通过 `wx.getUserProfile` API 来获取用户头像昵称等公开资料时遇到无法弹出授权框或返回数据为空的情况，这可能是由于未正确触发该方法或是用户的隐私设定所造成的[^1]。正确的做法应当是在适当的应用场景下引导用户主动点击按钮从而发起请求： ```javascript // 调用 wx.getUserProfile 接口前先检查是否已获得授权 uni.getSetting({ success(res) { if (!res.authSetting['scope.userInfo']) { // 如果没有授权，则显示提示让用户去设置页面打开相应权限 uni.showModal({ title: '提示', content: '您还未授予本应用访问您的个人信息权限，请前往设置页开启。', showCancel: false, confirmText: "立即前往", success() { uni.openSetting(); } }); } else { // 已经有授权的情况下可以直接调用 getUserProfile wx.getUserProfile({ desc: '用于完善会员资料', // 这里填写具体用途描述 success(infoRes){ console.log('用户同意提供信息:', infoRes); // 处理得到的信息... }, fail(err){ console.error('获取失败:', err); } }) } } }); ``` #### 获取用户手机号码 当目标是从用户处收集电话号码这类敏感信息时，除了上述提到的基本信息外还需要额外注意安全性和合法性方面的要求。开发者应该利用官方提供的组件 `<button open-type="getPhoneNumber">` 结合服务端验证机制完成这一功能。下面是一个简单的例子展示如何捕获并发送加密后的手机号给到自己的服务器做进一步解析： ```html <button type="primary" @click="bindGetPhoneNumber" open-type="getPhoneNumber"> 点击绑定手机 </button> ``` ```javascript methods: { bindGetPhoneNumber(e) { const iv = e.detail.iv; const encryptedData = e.detail.encryptedData; // 将加密过的数据传送到后端解密 this.$http.post('/api/decryptPhone',{ iv, encryptedData }).then(response => { console.log('解密后的手机号:', response.data.phoneNumber); }).catch(error => { console.error('解密过程中出现问题:', error.message); }); } } ``` 需要注意的是，以上提及的所有交互都应严格遵守微信关于个人隐私保护的规定，并向用户提供清晰的操作指引和充分的理由说明为何要获取此类信息。