原生小程序&UNIAPP开发添加​隐私弹窗教程

小程序备案通知搞得哀嚎遍野之际,微信又放大招《小程序隐私保护指引》,简单说下影响,如果你得小程序在2023年9月15号之前,不接入此接口,那么将直接禁用涉及用户隐私相关接口能力。

影响到的接口包括但不限于剪切板功能、上传/保存图片视频功能、获取昵称头像功能,反正肯定影响到你了。

具体涉及接口:

https://developers.weixin.qq.com/miniprogram/dev/framework/user-privacy/miniprogram-intro.html

这不管你是开发者,还是源码开发者,还是买程序运营,基本都会受到波及。最直观的影响就是15号之后,同行的程序能用,你得不能用了

因为我的程序基本都是uniapp与原生开发,所以本次教程使用插件的方式,让你的小程序快速接入隐私弹窗功能。

一、uniapp

插件原地址:

https://ext.dcloud.net.cn/plugin?id=14346

uniapp的小程序是有插件的,但我在插件市场的基础上修改了一下,因为用户如果点击了拒绝便无法再使用小程序的功能,所以我这里修改成了无法拒绝。

图片[1]-原生小程序&UNIAPP开发添加​隐私弹窗教程-极客分享

这种方式更省事,毕竟不同意还让他使用你的小程序,等功能无法用时又要报bug,现在直接避免此情况。

接入方式很简单,下载我提供的uniapp版插件包,解压后直接整包复制进你的项目根目录

图片[2]-原生小程序&UNIAPP开发添加​隐私弹窗教程-极客分享
图片[3]-原生小程序&UNIAPP开发添加​隐私弹窗教程-极客分享

如果你原本项目中有这个文件夹也没关系,直接覆盖即可,这是uniapp的新版插件目录,相同的插件覆盖即可。

然后打开你项目的manifest.json,点击源码视图,找到mp-weixin对象,在这里添加一个代码:

"__usePrivacyCheck__": true,
图片[4]-原生小程序&UNIAPP开发添加​隐私弹窗教程-极客分享

然后开始添加插件到页面中弹窗,具体加哪些页面呢,这里由你的程序性质决定,用户有机会打开,不通过首页能直接进入的页面最好都加,我懒,所以我只加首页弹窗

打开页面文件,在<template>中添加如下代码引入插件:

<!-- #ifdef MP-WEIXIN -->
<ws-wx-privacy id="privacy-popup"></ws-wx-privacy>
<!-- #endif -->
图片[5]-原生小程序&UNIAPP开发添加​隐私弹窗教程-极客分享

然后在<script>的onShow()或者onLoad()声明周期中,添加如下代码:

//#ifdef MP-WEIXIN        
wx.requirePrivacyAuthorize({            
  success: () => {                
    console.log('点击同意');            
 },            
  fail: () => {                
    console.log('点击拒绝');                            
 },             
  complete: () => {                
    console.log('用户已点击');            
 }       
})
//#endif
图片[6]-原生小程序&UNIAPP开发添加​隐私弹窗教程-极客分享

这样即可在用户进入小程序时就会弹出提示,并且不能拒绝

然后编译进入开发者工具,调试基础库必须高于2.23.3,并清除下缓存

图片[7]-原生小程序&UNIAPP开发添加​隐私弹窗教程-极客分享

成功!插件下载地址在文末

二、原生开发

原生插件由@陆大师提供

同样的,将文插件解压后整个复制进项目根目录

图片[8]-原生小程序&UNIAPP开发添加​隐私弹窗教程-极客分享
图片[9]-原生小程序&UNIAPP开发添加​隐私弹窗教程-极客分享

在app.json添加如下代码:

"usingComponents": {    
  "privacy": "/privacy/privacy"  
},  
"__usePrivacyCheck__": true,
图片[10]-原生小程序&UNIAPP开发添加​隐私弹窗教程-极客分享

然后在想添加弹窗的页面的wxml文件中引入插件

<privacy/>
图片[11]-原生小程序&UNIAPP开发添加​隐私弹窗教程-极客分享

调试基础库必须高于2.23.3,清除下缓存

成功!

图片[12]-原生小程序&UNIAPP开发添加​隐私弹窗教程-极客分享


下载地址:https://pan.quark.cn/s/a07efbf62994

------本页内容已结束,喜欢请分享------

感谢您的来访,获取更多精彩文章请收藏本站。

© 版权声明
THE END
喜欢就支持一下吧
点赞14赞赏 分享
评论 抢沙发
头像
欢迎您留下宝贵的见解!
提交
头像

昵称

取消
昵称表情代码图片

    暂无评论内容