manifest.json 源码模式增加 usePrivacyCheck
此功能与微信小程序隐私协议强相关,如添加,务必更新隐私协议添加响应的微信功能
"mp-weixin" : {
"appid" : "wx******",
"__usePrivacyCheck__": true,
}
添加公共组建(我的路径 /components/common/privacyPopup.vue)
<template>
<view class="privacy" v-if="showPrivacy">
<view class="content">
<view class="title">隐私保护指引</view>
<view class="des">
在使用当前小程序服务之前,请仔细阅读
<text class="link" @click="openPrivacyContract">{{ privacyContractName }}</text>
。如果你同意{{ privacyContractName }},请点击“同意”开始使用。
</view>
<view class="btns">
<button class="item reject" @click="exitMiniProgram">拒绝</button>
<button id="agree-btn" class="item agree" open-type="agreePrivacyAuthorization" @agreeprivacyauthorization="handleAgreePrivacyAuthorization">同意</button>
</view>
</view>
</view>
</template>
<script>
export default {
// // 组件privacyPopup.vue
name: 'privacyPopup',
data() {
return {
privacyContractName: '',
showPrivacy: false
};
},
mounted() {
console.log(getApp().globalData)
let that = this
//防止低版本报错,影响视觉
if (wx.onNeedPrivacyAuthorization)
wx.getPrivacySetting({
success(res) {
console.log('是否需要授权:', res.needAuthorization, '隐私协议的名称为:', res.privacyContractName);
if (res.needAuthorization) {
that.privacyContractName = res.privacyContractName;
that.showPrivacy = true;
} else {
that.showPrivacy = false;
}
},
fail(){
//如果首页有接口加载,错误的时候也需要执行(小程序分享到朋友圈后,点击进入没有任何权限的页面,此处不执行接口数据不展示)
//this.getNowLocation() //接口加载函数
}
});
},
methods: {
// 同意隐私协议
handleAgreePrivacyAuthorization() {
const that = this;
wx.requirePrivacyAuthorize({
success: res => {
that.showPrivacy = false;
getApp().globalData.showPrivacy = false;
that.$emit('enterLoad')
}
});
},
// 拒绝隐私协议
exitMiniProgram() {
const that = this;
uni.showModal({
content: '如果拒绝,我们将无法获取您的信息, 包括手机号、位置信息、相册等该小程序十分重要的功能,您确定要拒绝吗?',
success: res => {
if (res.confirm) {
that.showPrivacy = false;
uni.exitMiniProgram({
success: () => {
console.log('退出小程序成功');
}
});
}
}
});
},
// 跳转协议页面
// 点击高亮的名字会自动跳转页面 微信封装好的不用操作
openPrivacyContract() {
wx.openPrivacyContract({
fail: () => {
uni.showToast({
title: '网络错误',
icon: 'error'
});
}
});
}
}
};
</script>
<style lang="scss" scoped>
.privacy {
position: fixed;
top: 0;
right: 0;
bottom: 0;
left: 0;
background: rgba(0, 0, 0, 0.5);
z-index: 9999999;
display: flex;
align-items: center;
justify-content: center;
.content {
width: 85vw;
padding: 50rpx;
box-sizing: border-box;
background: #fff;
border-radius: 16rpx;
.title {
text-align: center;
color: #333;
font-weight: bold;
font-size: 34rpx;
}
.des {
font-size: 26rpx;
color: #666;
margin-top: 40rpx;
text-align: justify;
line-height: 1.6;
.link {
color: #5F853D;
text-decoration: underline;
}
}
.btns {
margin-top: 60rpx;
display: flex;
justify-content: space-between;
.item {
justify-content: space-between;
width: 244rpx;
height: 80rpx;
display: flex;
align-items: center;
justify-content: center;
border-radius: 16rpx;
box-sizing: border-box;
border: none;
}
.reject {
background: #f4f4f5;
color: #909399;
}
.agree {
background: #5F853D;
color: #fff;
}
}
}
}
</style>
使用
//页面无主动使用(如进入页面直接调用位置信息)微信功能时,仅添加组建,@enterLoad 删除掉
<template>
<CommonPrivacyPopup @enterLoad="privacyCallback"></CommonPrivacyPopup>
</template>
import CommonPrivacyPopup from '@/components/common/privacyPopup.vue';
onLoad(){
this.privacyCallback()
},
components: {
CommonPrivacyPopup
},
methods: {
privacyCallback(){
let that = this
//判断是否支持此函数(可能部分用户不更新版本)
if (wx.onNeedPrivacyAuthorization){
//再次获取一次是否同意隐私的权限
wx.getPrivacySetting({
success: res => {
if (!res.needAuthorization) {
that.pervGetAuth()
}
},
fail(){
console.log('123')
}
});
}else{
that.pervGetAuth()
}
},
//获取位置权限及信息
async pervGetAuth() {
let sysLocation = await WechatMini.getSysLocation()
let AuthLocation = await WechatMini.getUserLocationAuth()
this.prevLoad()
},
}
uniapp 全局组件形式,添加后,使用中取出引用组件的代码
pages.json
"easycom": {
"CommonPrivacyPopup":"@/components/common/privacyPopup.vue"
}
备注:getPrivacySetting 状态信息可以添加至vuex,避免重复获取(此方案未处理)