点击进入uniapp文档 - 微信小程序隐私协议开发指南
在开发功能的使用时，有关个人用户信息的调用，需要提前向用户询问(需要配置隐私指引）并得以肯定才可调用
点击进入微信小程序说明文档
写个隐私协议的privacy.vue组件，并引入到文件中使用（uniapp中使用到的vue的文件）
// privacy.vue
<template>
<van-popup:show="innerShow"custom-style="background-color: transparent;overflow:visible;":z-index="100":catchtouchmove="true"
><view class="content"><image class="privacy_icon" src="" mode="scaleToFill"></image><view class="title">用户隐私保护提示</view><view class="des">感谢您使用本小程序，请您在使用前阅读完整版<text class="link" @click="openPrivacyContract">{{ privacyContractName }}</text>了解详细信息。</view><view class="des">当您点击同意开始使用我们的产品和服务，即表示您已理解并同意该条款内容，我们将保护您的个人信息安全，并为您提供完整的服务。</view><view class="btns"><button id="disagree-btn" class="item reject" @click="handleDisagree">不同意</button><button id="agree-btn" class="item agree" open-type="agreePrivacyAuthorization" @agreeprivacyauthorization="handleAgree">同意</button></view></view>
</van-popup>
</template><script>
let privacyHandler;
let privacyResolves = new Set();
let closeOtherPagePopUpHooks = new Set();
if (wx.onNeedPrivacyAuthorization) {wx.onNeedPrivacyAuthorization(resolve => {if (typeof privacyHandler === 'function') {privacyHandler(resolve)}});
}
const closeOtherPagePopUp = (closePopUp) => {closeOtherPagePopUpHooks.forEach(hook => {if (closePopUp !== hook) {hook()}})
}
export default {data() {return {innerShow: false,privacyContractName: '《***小程序隐私保护指引》',currentPage: '', // 当前页面地址// 不同意授权页面的判断 - 用于不同意授权的页面就回退的使用（如：页面需要定位才可进行）disagreePrivacyPageList: ['pages/tabBar/discounts/index'],}},mounted() {const pageList = getCurrentPages();const currentPageObj = pageList[pageList.length - 1];this.currentPage = currentPageObj.route;const closePopUp = () => {this.disPopUp()}privacyHandler = resolve => {privacyResolves.add(resolve)this.popUp();// 额外逻辑：当前页面的隐私弹窗弹起的时候，关掉其他页面的隐私弹窗closeOtherPagePopUp(closePopUp);}closeOtherPagePopUpHooks.add(closePopUp)this.closePopUp = closePopUp;// 低版本基础库不支持 wx.getPrivacySetting 接口，隐私接口可以直接调用if (!wx.getPrivacySetting) return;wx.getPrivacySetting({success: res => {this.privacyContractName = res.privacyContractName; // 隐私协议的名称if (res.needAuthorization) {return this.popUp()}},fail: () => { },complete: () => { },})},beforeDestroy() {closeOtherPagePopUpHooks.delete(this.closePopUp);},methods: {handleAgree(e) {this.disPopUp()// 这里演示了同时调用多个wx隐私接口时要如何处理：让隐私弹窗保持单例，点击一次同意按钮即可让所有pending中的wx隐私接口继续执行 （看page/index/index中的 wx.getClipboardData 和 wx.startCompass）privacyResolves.forEach(resolve => {resolve({event: 'agree',buttonId: 'agree-btn'})})privacyResolves.clear()},// 不同意授权handleDisagree(e) {this.disPopUp()privacyResolves.forEach(resolve => {const isBack = this.disagreePrivacyPageList.includes(this.currentPage);if(isBack) {// 用于回退 或者跳转到首页的使用// this.$switchTab('/pages/tabBar/shopMall/index');}resolve({event: 'disagree',});});privacyResolves.clear();},popUp() {if (this.innerShow === false) {this.innerShow = true;}},disPopUp() {if (this.innerShow === true) {this.innerShow = false;}},// 打开翻看协议openPrivacyContract() {wx.openPrivacyContract();},LifetimesShow() {if (this.closePopUp) {privacyHandler = resolve => {privacyResolves.add(resolve)this.popUp()// 额外逻辑：当前页面的隐私弹窗弹起的时候，关掉其他页面的隐私弹窗closeOtherPagePopUp(this.closePopUp)}}}},
}
</script><style scoped lang="scss">
.content {width: 648rpx;padding: 64rpx 58rpx 66rpx;box-sizing: border-box;background: linear-gradient(180deg,#ffe7dd, #ffffff 28%);border: 4rpx solid #ffddc4;border-radius: 52rpx;box-shadow: 0rpx 0rpx 18rpx 0rpx rgba(255,255,255,0.99) inset;overflow: hidden;text-align: center;.privacy_icon{width: 110rpx;height: 172rpx;margin: 0 auto 22rpx;display: block;background: gray;}.title{font-size: 40rpx;font-family: Source Han Sans CN, Source Han Sans CN-Bold;font-weight: 700;color: #000;}.des {color: #666;margin-top: 40rpx;font-size: 28rpx;text-align: left;color: #6c6c6c;line-height: 1.5;.link{color: #FF492D;}}
}.btns {margin-top: 76rpx;display: flex;.item {justify-content: space-between;display: flex;align-items: center;justify-content: center;box-sizing: border-box;border: none;width: 220rpx;height: 76rpx;background: #ffffff;border: 2rpx solid transparent;border-radius: 40rpx;&.reject {color: #676767;border-color: #B6B6B6;}&.agree {background: #EB2C0E;color: #fff;}}
}
</style>
将此组件注册为全局组件，并以全局的形式的引入到main.js文件中
// 用户隐私权限的嵌入
import privacy from '@/components/privacy/privacy.vue';
Vue.component('privacy', privacy);
在需要使用到协议的页面，直接使用即可；
<privacy ref='privacy'></privacy>
如果在项目中，每个页面都需要引用到<privacy ref='privacy'></privacy>的组件使用,但却难以在每个文件中添加，使用全局的方式引用，在pages.json中使用insetLoader的形式导入，使用此方式可在页面的根目录中导入此组件使用
// pages.json
{"insetLoader": {"config": {"privacy": "<privacy ref='privacy'></privacy>"},"label": ["privacy"],"rootEle": "view"}
}
但如果uniapp的项目中存在分包的形式，此组件不会引入到分包的文件中，还是需要在页面的.vue的文件中添加使用