uniapp开发微信小程序获取用户手机号之前判断是否同意隐私协议

### 实现 UniApp 微信小程序获取手机号前判断用户是否同意隐私协议 在 UniApp 中开发微信小程序时，为了确保合法合规地获取用户的手机号码，需先确认用户已阅读并同意隐私协议。以下是完整的解决方案： #### 1. **初始化应用全局变量** 在 `App.vue` 文件中定义全局数据存储对象 `globalData`，用于保存隐私协议状态以及相关参数。 ```javascript export default { globalData: { showPrivacy: false, // 是否显示隐私协议弹窗 privacyContractName: '', // 隐私协议名称 hasAgreedPrivacy: false // 用户是否已经同意隐私协议 }, onLaunch() { this.checkPrivacyAuthorization(); }, methods: { checkPrivacyAuthorization() { // #ifdef MP wx.getPrivacySetting({ success(res) { if (res.needAuthorization) { this.globalData.privacyContractName = res.privacyContractName; this.globalData.showPrivacy = true; // 显示隐私协议弹窗 this.globalData.hasAgreedPrivacy = false; // 默认未同意 } else { this.globalData.showPrivacy = false; // 不需要显示隐私协议弹窗 this.globalData.hasAgreedPrivacy = true; // 已经同意过隐私协议 } }.bind(this), fail(err) { console.error('获取隐私设置失败：', err); } }); // #endif } } } ``` 此处逻辑基于引用[^2]中的方法实现，通过调用 `wx.getPrivacySetting` 接口检测用户是否需要重新授权隐私协议。 --- #### 2. **展示隐私协议页面** 如果用户尚未同意隐私协议，则跳转至专门的隐私协议页面让用户完成操作。 在隐私协议页面中提供两个按钮：“不同意” 和 “同意”。当点击“同意”按钮时触发以下逻辑： ```html <template> <view v-if="showPrivacy"> <!-- 展示隐私协议 --> <text>{{privacyContractName}}</text> <button open-type="agreePrivacyAuthorization" @click="onAgree">同意</button> <button @click="onDisagree">不同意</button> </view> </template> <script> export default { data() { return { showPrivacy: getApp().globalData.showPrivacy, privacyContractName: getApp().globalData.privacyContractName }; }, methods: { onAgree() { getApp().globalData.hasAgreedPrivacy = true; // 设置为已同意 getApp().globalData.showPrivacy = false; // 关闭弹窗 }, onDisagree() { uni.showToast({ title: '您拒绝了隐私协议', icon: 'none' }); setTimeout(() => { uni.navigateBack(); // 返回上一页 }, 1000); } } }; </script> ``` 此部分利用了引用[^3]提到的功能，在 `<button>` 上绑定扩展事件 `open-type="agreePrivacyAuthorization"` 来通知微信平台用户已同意隐私协议。 --- #### 3. **获取手机号功能** 只有当用户同意隐私协议后才允许执行获取手机号的操作。具体流程如下： ```javascript methods: { getPhoneNumber(e) { const app = getApp(); if (!app.globalData.hasAgreedPrivacy) { uni.showToast({ title: '请先同意隐私协议', icon: 'none' }); return; } const encryptedData = e.detail.encryptedData; const iv = e.detail.iv; if (e.detail.errMsg === 'getPhoneNumber:ok') { // 调用后端解密接口处理 encryptedData 和 iv uni.login({ provider: 'weixin', success(async loginRes) => { try { const result = await uni.request({ url: '/api/decryptPhone', // 替换为实际接口地址 method: 'POST', data: { code: loginRes.code, encryptedData: encryptedData, iv: iv } }); console.log('手机号解析成功：', result.data.phoneNumber); // 执行后续业务逻辑... } catch (error) { console.error('手机号解析失败：', error); } } }); } else { uni.showToast({ title: '取消获取手机号', icon: 'none' }); } } } ``` 以上代码片段实现了对用户手机号的安全获取过程，并结合引用[^1]和[^4]的内容完成了必要的校验与交互设计。 --- ### 总结 整个方案分为三个主要模块： - 初始化阶段检查用户是否需要再次授权隐私协议； - 提供清晰的界面引导用户完成隐私协议签署动作； - 在满足条件的前提下安全高效地提取用户手机号信息。