微信小程序隐私授权

2023-09-15 12:00:09

微信开发者平台新公告:2023年9月15之后,隐私协议将被启用,所以以后的小程序都要加上隐私协议的内容提示用户,

首先设置好隐私协议的内容,登录小程序的开发者后台,在设置--》服务内容声明--》用户隐私保护指引,点击右侧的“更新”,可以在线编辑隐私协议内容,编辑完保存;

然后在代码中创建一个components文件夹,用来放自定义组件,在里面创建一个privacy组件,

组件里面的各个页面的代码:

privacy.js:

// component/privacy/privacy.js
Component({
  /**
   * 组件的初始数据
   */
  data: {
      privacyContractName: '',
      showPrivacy: false
  },
  /**
   * 组件的生命周期
   */
  pageLifetimes: {
      show() {
          const _ = this
          wx.getPrivacySetting({
              success(res) {
                  if (res.needAuthorization) {
                      _.setData({
                          privacyContractName: res.privacyContractName,
                          showPrivacy: true
                      })
                  }
              }
          })
      }
  },
  /**
   * 组件的方法列表
   */
  methods: {
      // 打开隐私协议页面
      openPrivacyContract() {
          const _ = this
          wx.openPrivacyContract({
              fail: () => {
                  wx.showToast({
                      title: '遇到错误',
                      icon: 'error'
                  })
              }
          })
      },
      // 拒绝隐私协议
      exitMiniProgram() {
          // 直接退出小程序
          wx.exitMiniProgram()
      },
      // 同意隐私协议
      handleAgreePrivacyAuthorization() {
          const _ = this
          _.setData({
              showPrivacy: false
          })
      },
  },
})

privacy.json:

{
  "component": true,
  "usingComponents": {}
}

privacy.wxml:

<view class="privacy" wx:if="{{showPrivacy}}">
    <view class="content">
        <view class="title">隐私保护指引</view>
        <view class="des">
            在使用当前小程序服务之前,请仔细阅读<text class="link" bind:tap="openPrivacyContract">{{privacyContractName}}</text>。为了完整体验,请您点击“同意”开始使用。
        </view>
        <view class="btns">
            <button class="item reject" bind:tap="exitMiniProgram">拒绝</button>
            <button id="agree-btn" class="item agree" open-type="agreePrivacyAuthorization" bindagreeprivacyauthorization="handleAgreePrivacyAuthorization">同意</button>
        </view>
    </view>
</view>

privacy.wxss:

.privacy {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background: rgba(0, 0, 0, .5);
  z-index: 9999999;
  display: flex;
  align-items: center;
  justify-content: center;
}

.content {
  width: 632rpx;
  padding: 48rpx;
  box-sizing: border-box;
  background: #fff;
  border-radius: 16rpx;
}

.content .title {
  text-align: center;
  color: #333;
  font-weight: bold;
  font-size: 32rpx;
}

.content .des {
  font-size: 26rpx;
  color: #666;
  margin-top: 40rpx;
  text-align: justify;
  line-height: 1.6;
}

.content .des .link {
  color: #07c160;
  text-decoration: underline;
}

.btns {
  margin-top: 48rpx;
  display: flex;
}

.btns .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;
}

.btns .reject {
  background: #f4f4f5;
  color: #909399;
}

.btns .agree {
  background: #07c160;
  color: #fff;
}

一般在首页(小程序第一个加载的页面)把这个隐私协议组件引入,例如index是我的首页,在index.json文件内引入这个组件:

{
    "navigationBarTitleText": "首页",
    "enablePullDownRefresh": false,
    "usingComponents": {
        "custom-tab-bar": "/components/custom-tab-bar/index",
        "Privacy": "/components/privacy/privacy"
    }
}

然后在index.wxml页面放这个组件就行了,可以放到任意位置:

<!--隐私协议-->
<Privacy />

这样第一次进入小程序的时候会出现一个弹窗,用户点击同意后就不会再出现了,除非主动删除了这个小程序,

这样隐私协议就引入结束了。

更多推荐

C++:string类的常用接口说明及其模拟实现

本文主要介绍string类和该类常用的接口,并根据接口功能对其进行模拟实现。目录一、string类的常用接口说明1.string类对象的常见构造2.string类对象的容量操作3.string类对象的访问及遍历操作4.string类对象的修改操作5.string类非成员函数二、string的模拟实现1.默认成员函数和成

【CDN和UDN】CDN和UDN技术特点以及使用场景

内容分发网络(CDN)和用户自定义网络(UDN)是两种不同的网络技术,在选择时,往往不能准备把握具不同的技术特点和应用场景。CDN主要用于加速内容分发,而UDN则主要用于支持用户自定义的网络需求。本文简要介绍下内容分发网络(CDN):一种通过在多个地理位置部署缓存服务器来加速内容分发的网络技术。当用户请求内容时,CDN

【Seata】05 - Seata Saga 模式简单整理、Docker 部署 Nacos 单机(基于 Jpom)相关配置

文章目录前言参考目录Saga模式知识点简单整理1、适用场景、优缺点2、Saga模式的使用3、可能出现的问题以及解决方法Docker部署Nacos单机(基于Jpom)步骤1:拉取镜像步骤2:构建容器步骤3:Nacos设置Seata配置文件步骤4:修改SeataServer相关配置步骤5:修改SeataClient相关配置

@Autowire、@Recourse用啥?

在使用IDEA写Spring相关的项目的时候,在字段上使用@Autowired注解时,总是会有一个波浪线提示:Fieldinjectionisnotrecommended.这是为啥呢?今天就来一探究竟。众所周知,在Spring里面有三种可选的注入方式:构造器注入、Setter方法注入、Field注入,我们先来看下这三种

设计模式:外观模式(C++实现)

外观模式(FacadePattern)是一种结构设计模式,它提供了一个统一的接口,用于访问子系统中的一组接口。外观模式隐藏了子系统的复杂性,使得客户端只需要与外观对象交互,而不需要直接与子系统中的对象进行交互。以下是一个简单的C++外观模式的示例:#include<iostream>//子系统类AclassSubsys

Springboot2.7集成websocket及相关问题

1、集成websocket完整代码导入maven依赖<dependency><groupId>org.springframework.boot</groupId><artifactId>spring-boot-starter-websocket</artifactId></dependency>服务端代码(1)注入be

使用亚马逊云服务器在 G4 实例上运行 Android 应用程序

随着Android应用程序和游戏变得越来越丰富,其中有些甚至比PC上的软件更易于使用和娱乐,因此许多人希望能够在云上运行Android游戏或应用程序,而在EC2实例上运行Android的解决方案可以让开发人员更轻松地测试和运行Android应用程序。在这篇博客文章中,我们将展示如何使用NICEDCV在Anbox中运行A

如何通过文件自动备份软件进行自动化备份?

​为什么要使用文件自动备份软件有一位做客户资料保管登记的朋友,每天会在电脑上录入很多新的客户资料,并需要进行相关维护。比如删掉一些取消合作的客户,或者添加一些备注等等。对于像他这种工作性质的人来说,很需要一个可以进行文件自动备份的软件,无论电脑出现什么问题,可以将重要资料还原。其实每个人有对自己而言特别珍贵或重要的资料

一份企业业务流程自动化指南

自2020年以来,与低代码相关的种种趋势已经充分表明,更加高效的开发速度是企业数字化转型过程中的主要目标之一。Gartner曾预测,到2023年底,低代码开发技术市场将增长20%。此外,他们还预计,到2026年,非正式IT部门的开发人员将占低代码开发工具用户群至少80%的比例,而这一比例在2021年为60%。基于过去所

贪心算法-会议室问题

1、题目描述一些项目要占用一个会议室宣讲,会议室不能同时容纳两个项目。现在给你两个长度一样的数组,starts数组代码每个会议开始的时间,ends数组代表每个会议结束的时间。在给你一个当前时间,请你求出当日可以利用会议室宣讲的最大值思路分析:1.按照最早开始的会议排序,最早开始的优先。2.按照最短时间排序,时间最短的优

Linux系统编程——网络编程的学习

Linux系统编程学习相关博文Linux系统编程——文件编程的学习Linux系统编程——进程的学习Linux系统编程——进程间通信的学习Linux系统编程——线程的学习Linux系统编程——网络编程的学习一、概述1.TCP/UDP2.端口号3.字节序4.Sockt服务器和客户端的开发步骤1.服务器2.客户端二、网络编程

热文推荐