uinapp微信小程序隐私政策授权

2023-11-06 16:03

本文主要是介绍uinapp微信小程序隐私政策授权,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

🚀 隐私弹窗效果图:

在这里插入图片描述

1、启用隐私相关功能在manifest.json文件中配置 usePrivacyCheck: true
"mp-weixin" : {"__usePrivacyCheck__" : true,
},
2、创建组件
<template><view><!-- 隐私政策弹窗 --><uni-popup ref="popup"><view class="popup-wrap"><view class="pop-title">用户隐私保护提示</view><view class="popup-txt">感谢您使用本小程序,在使用前您应当阅读井同意<text class="blue-color" @click="handleOpenPrivacyContract">{{privacyContractName}}</text>,当点击同意并继续时,即表示您已理解并同意该条款内容,该条款将对您产生法律约束力;如您不同意,将无法继续使用小程序相关功能。</view><view class="popup-bot"><button id="disagree-btn" type="default" @click="handleDisagree">不同意</button><button id="agree-btn" type="primary" open-type="agreePrivacyAuthorization"@agreeprivacyauthorization="handleAgreePrivacyAuthorization">同意并继续</button></view></view></uni-popup></view>
</template><script>export default {name: "privacyPopup",data() {return {privacyContractName: "" //协议名称};},mounted() {this.checkPrivacy()},methods: {// 判断是否授权协议checkPrivacy() {return new Promise((resolve,reject) => {uni.getPrivacySetting({success: res => {if (res.needAuthorization) {this.privacyContractName = res.privacyContractName;this.$refs.popup.open('center')} else {resolve(res)}},fail: (err) => {reject(err)}})})},// 关闭协议handleDisagree(e) {this.$refs.popup.close()},handleAgreePrivacyAuthorization(res) {// 用户同意隐私协议事件回调// 用户点击了同意,之后所有已声明过的隐私接口和组件都可以调用了this.$refs.popup.close()//通知父组件this.$emit("agreePrivacy")},handleOpenPrivacyContract() {// 打开隐私协议页面uni.openPrivacyContract({success: () => {}, // 打开成功fail: () => {}, // 打开失败complete: (res) => {console.log(res, "openPrivacyContract complete");}})},}}
</script><style lang="scss" scoped>.popup-wrap {width: 540upx;box-sizing: border-box;padding: 42upx;background: white;border-radius: 30upx;.pop-title {text-align: center;font-size: 31upx;color: #000;font-weight: bold;margin-bottom: 20upx;}.blue-color {color: rgba(39, 152, 240, 1);}.popup-txt {line-height: 48upx;font-size: 28upx;}.popup-bot {display: flex;justify-content: space-between;align-items: center;margin-top: 30upx;>button {color: #FFF;font-size: 26rpx;font-weight: 500;line-height: 80rpx;width: 46%;text-align: center;height: 80rpx;border-radius: 16rpx;border: none;background: #07c160;}>button:nth-of-type(1){color: #07c160;background: #f2f2f2;}}}
</style>
3、组件使用
<privacyPopup @agreePrivacy="执行同意协议后的逻辑"></privacyPopup>

🚀 扩展:

因小程序中各个地方都会涉及到授权问题,依次引入组件过繁琐
1、可以将组件放置App.vue页面
2、通过vuex进入监听全局是否需要弹窗授权,可利用vux state变量进行触发
3、写一个公共方法判断是否授权协议去设置vuex即可

这篇关于uinapp微信小程序隐私政策授权的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!


原文地址:
本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.chinasem.cn/article/357625

相关文章

Spring Boot 结合 WxJava 实现文章上传微信公众号草稿箱与群发

《SpringBoot结合WxJava实现文章上传微信公众号草稿箱与群发》本文将详细介绍如何使用SpringBoot框架结合WxJava开发工具包,实现文章上传到微信公众号草稿箱以及群发功能,... 目录一、项目环境准备1.1 开发环境1.2 微信公众号准备二、Spring Boot 项目搭建2.1 创建

golang程序打包成脚本部署到Linux系统方式

《golang程序打包成脚本部署到Linux系统方式》Golang程序通过本地编译(设置GOOS为linux生成无后缀二进制文件),上传至Linux服务器后赋权执行,使用nohup命令实现后台运行,完... 目录本地编译golang程序上传Golang二进制文件到linux服务器总结本地编译Golang程序

使用Docker构建Python Flask程序的详细教程

《使用Docker构建PythonFlask程序的详细教程》在当今的软件开发领域,容器化技术正变得越来越流行,而Docker无疑是其中的佼佼者,本文我们就来聊聊如何使用Docker构建一个简单的Py... 目录引言一、准备工作二、创建 Flask 应用程序三、创建 dockerfile四、构建 Docker

java向微信服务号发送消息的完整步骤实例

《java向微信服务号发送消息的完整步骤实例》:本文主要介绍java向微信服务号发送消息的相关资料,包括申请测试号获取appID/appsecret、关注公众号获取openID、配置消息模板及代码... 目录步骤1. 申请测试系统2. 公众号账号信息3. 关注测试号二维码4. 消息模板接口5. Java测试

MySQL 用户创建与授权最佳实践

《MySQL用户创建与授权最佳实践》在MySQL中,用户管理和权限控制是数据库安全的重要组成部分,下面详细介绍如何在MySQL中创建用户并授予适当的权限,感兴趣的朋友跟随小编一起看看吧... 目录mysql 用户创建与授权详解一、MySQL用户管理基础1. 用户账户组成2. 查看现有用户二、创建用户1. 基

Python基于微信OCR引擎实现高效图片文字识别

《Python基于微信OCR引擎实现高效图片文字识别》这篇文章主要为大家详细介绍了一款基于微信OCR引擎的图片文字识别桌面应用开发全过程,可以实现从图片拖拽识别到文字提取,感兴趣的小伙伴可以跟随小编一... 目录一、项目概述1.1 开发背景1.2 技术选型1.3 核心优势二、功能详解2.1 核心功能模块2.

python编写朋克风格的天气查询程序

《python编写朋克风格的天气查询程序》这篇文章主要为大家详细介绍了一个基于Python的桌面应用程序,使用了tkinter库来创建图形用户界面并通过requests库调用Open-MeteoAPI... 目录工具介绍工具使用说明python脚本内容如何运行脚本工具介绍这个天气查询工具是一个基于 Pyt

Ubuntu设置程序开机自启动的操作步骤

《Ubuntu设置程序开机自启动的操作步骤》在部署程序到边缘端时,我们总希望可以通电即启动我们写好的程序,本篇博客用以记录如何在ubuntu开机执行某条命令或者某个可执行程序,需要的朋友可以参考下... 目录1、概述2、图形界面设置3、设置为Systemd服务1、概述测试环境:Ubuntu22.04 带图

Python程序打包exe,单文件和多文件方式

《Python程序打包exe,单文件和多文件方式》:本文主要介绍Python程序打包exe,单文件和多文件方式,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教... 目录python 脚本打成exe文件安装Pyinstaller准备一个ico图标打包方式一(适用于文件较少的程

Python程序的文件头部声明小结

《Python程序的文件头部声明小结》在Python文件的顶部声明编码通常是必须的,尤其是在处理非ASCII字符时,下面就来介绍一下两种头部文件声明,具有一定的参考价值,感兴趣的可以了解一下... 目录一、# coding=utf-8二、#!/usr/bin/env python三、运行Python程序四、