记2023.11.08

一、配置微信后台

登录微信公众号小程序管理后台----设置----服务内容与声明---用户隐私保护指引（更新）----增加信息类型（以下图示）----选择需要获取用户的隐私信息类型（比如：用户信息（微信昵称……），手机号等）

类型信息

二、配置项目文件

项目文件：manifest.json--源码视图

"mp-weixin": {
    "__usePrivacyCheck__": true
},

三、自定义隐私弹框

template

<u-modal :show="privacyAuthPopup" v-model="privacyAuthPopup" :mask-close-able="true" title="隐私保护指引" :show-confirm-button="false">
            <view class="content">
                <view class="des">
                    感谢使用{{ projectName }}！请您仔细阅读并充分理解
                    <text class="link" @click="openPrivacyContract">{{ privacyContractName }}</text>
                    ，如您同意前述协议的全部内容，请点击“同意并继续”开始使用。
                    <text class="cancel">如您不同意，将被限制使用部分功能，或将在您使用具体功能前再次询问以取得您的授权同意。</text>
                </view>
                <view class="buttons">
                    <button class="reject" @click="handleDisagree">不同意</button>
                    <button class="agree" id="agree-btn" open-type="agreePrivacyAuthorization" @agreeprivacyauthorization="handleAgreePrivacyAuthorization">同意并继续</button>
                </view>
            </view>
</u-modal>

script

export default {
    data() {
        return {
            privacyAuthPopup: false,
            privacyContractName: 'xxx小程序隐私协议'
        };
    },
    onLoad() {
        let that = this;
        if (wx.getPrivacySetting) {
            wx.getPrivacySetting({
                success: (res) => {
                    console.log(res);
                    if (res.needAuthorization) {
                        this.privacyContractName = res.privacyContractName;
                        this.popUp();
                    } else {
                        // 用户已经同意过隐私协议，所以不需要再弹出隐私协议，也能调用隐私接口
                    }
                },
                fail: () => {},
                complete: () => {}
            });
        } else {
            this.triggerEvent('agree');
        }
        if (wx.onNeedPrivacyAuthorization) {
            wx.onNeedPrivacyAuthorization((resolve, eventInfo) => {
                console.log('触发本次事件的接口是：', resolve, eventInfo.referrer);
            });
        }
    },
methods: {
        // 用户点击同意按钮后
        handleAgreePrivacyAuthorization() {
            this.triggerEvent('agree');
            this.disPopUp();
        },
        // 不同意
        handleDisagree() {
            this.triggerEvent('disagree');
            this.disPopUp();
            // 退出小程序
            uni.exitMiniProgram();
        },
        // 打开
        popUp() {
            this.privacyAuthPopup = true;
        },
        // 关闭
        disPopUp() {
            this.privacyAuthPopup = false;
        },
        triggerEvent(e) {
            if (wx.onNeedPrivacyAuthorization) {
                wx.onNeedPrivacyAuthorization((resolve, eventInfo) => {
                    resolve({ buttonId: 'agree-btn', event: e });
                });
            }
        },
        // 跳转小程序协议
        openPrivacyContract() {
            wx.openPrivacyContract({
                success: (res) => {
                    console.log('openPrivacyContract success');
                },
                fail: (res) => {
                    console.error('openPrivacyContract fail', res);
                }
            });
        },
   }
}

style

.buttons {
    margin-top: 20px;
    display: flex;
}
.buttons button {
    height: 40px;
    line-height: 40px;
    background: #1183ff;
    border-radius: 20px;
    color: #fff;
    padding: 0 20px;
}

.link {
    color: #1183ff;
    cursor: pointer;
}

效果图

uniapp-小程序隐私弹窗效果图