uniapp 微信小程序之隐私协议开发
官网通知:https://developers.weixin.qq.com/miniprogram/dev/framework/user-privacy/PrivacyAuthorize.html
1、配置 __usePrivacyCheck__: true
;位置 manifest.json :
json
"mp-weixin":{
"__usePrivacyCheck__": true,
"requiredPrivateInfos": [ // 权限授权API 示例
"chooseLocation",
"getLocation"
],
}
2、用户隐私保护指引中添加对应的权限,提交审核,位置:微信公众平台->设置->服务内容声明->用户隐私保护指引->更新
3、自定义弹框
html
<u-popup v-model="show" mode="bottom" :mask-close-able="false">
<view style="padding: 14px">
<view style="padding: 0 0 5px 0">
{{title}}
</view>
<view>
<view class="content">{{desc1}}</view>
<view class="content" style="color:blue" @click="openPrivacy">{{urlTitle}}</view>
<view class="content">{{desc2}}</view>
</view>
<view style="display:flex">
<button id="disagree-btn" @click="closePopup" size="mini" style="flex: 1;margin-right: 8px">拒绝</button>
<!--当点击同意按钮时就已经触发-->
<button id="agree-btn" size="mini" type="primary" style="flex: 1" open-type="agreePrivacyAuthorization" v-show="!isAgreePrivacy" @agreeprivacyauthorization="handleAgree">已阅读并同意</button>
</view>
</view>
</u-popup>
js
data() {
return {
show: false, // 弹窗
title: "用户隐私保护提示",
desc1: "感谢您使用本程序,您使用本程序前应当阅读并同意",
urlTitle: "《用户隐私保护协议》",
desc2: "当您点击已阅读并同意时,即表示您已理解并同意该条款内容。如您拒绝,将无法正常使用。",
isAgreePrivacy: false,// 是否已同意
resolvePrivacyAuthorization: null // wx.onNeedPrivacyAuthorization 的回调
}
}
js
// 弹出授权弹窗
openPopup(){
// 查询隐私授权情况
wx.getPrivacySetting({
success: res => {
// needAuthorization 是否需要授权
if (!res.needAuthorization) {
this.isAgreePrivacy = true
}
},
fail: () => {
},
})
this.show = true
// 模拟隐私接口调用,并触发隐私弹窗逻辑
// wx.requirePrivacyAuthorize({});
// 监听隐私接口需要用户授权事件。当需要用户进行隐私授权时会触发。触发该事件时,开发者需要弹出隐私协议说明,并在用户同意或拒绝授权后调用回调接口 resolve 触发原隐私接口或组件继续执行
// wx.onNeedPrivacyAuthorization((resolve, eventInfo) => {
// // 需要用户同意隐私授权时
// // 弹出开发者自定义的隐私授权弹窗
// console.log(resolve)
// this.resolvePrivacyAuthorization = resolve
// })
},
// 同意协议
handleAgree() {
// this.resolvePrivacyAuthorization({
// buttonId: 'agree-btn',
// event: 'agree'
// })
// 如果用户之前已经同意过隐私授权,会立即返回success回调
wx.requirePrivacyAuthorize({
success: res => {
this.show = false;
this.isAgreePrivacy = true;
}
});
},
// 用户隐私协议详情
openPrivacy() {
// 跳转至隐私协议页面
wx.openPrivacyContract({})
},
// 关闭弹窗
closePopup() {
// this.resolvePrivacyAuthorization({
// event: 'disagree'
// })
this.show = false
}