首页 > 其他分享 >【HarmonyOS】元服务隐私协议开发指导样例

【HarmonyOS】元服务隐私协议开发指导样例

时间：2023-07-14 10:34:27浏览次数：69  
标签：index detailman flex dataStorage 样例 HarmonyOS 隐私 页面

【关键字】

隐私、弹窗、元服务、协议

 

【介绍】

每个元服务必须提供隐私声明，否则将导致提交元服务发布上架时，审核无法通过。隐私声明的具体要求请参见隐私声明规范。用户使用元服务前，必须引导其了解隐私声明信息，获取用户授权后，才能继续使用元服务。

废话不多说，上代码！！

 

【方式一】推荐在首次启动或者注册登录时呈现隐私声明：

cke_93727.png​​

代码结构：新建detailman页面用来显示上图超链接跳转的H5页面，index页面是元服务首页

cke_1032.png​

实现代码：index.hml文件,使用dialog组件实现协议弹出框，协议内容使用<text>+<span>组件实现协议跳转，span的value定义在JS文件的data中。（这里请注意：直接将协议内容写到组件内无法实现首行缩进，API7+才支持）

<div class="container">
    <button style="height: 5%; width: 30%;" onclick="onShow">Helloworld</button>

<!--方式一：首次打开弹窗-->
<!--下方dialog组件整体复制到元服务首页hml中任意位置-->
<!-- copy   start-->
    <dialog id="dragDialog" dragable="false" style="height: 60%; width: 90%; margin-bottom: 15%;">
        <div style="flex-direction: column; align-items: center; height: 100%; width: 100%;">
            <div style="height: 15%; width: 100%; justify-content: center; align-items: center;">
                <text style="font-size: 20px; font-weight: 900;">{{ this.head }}</text>
            </div>
            <div style="height: 70%; width: 100%; justify-content: center;">
                <text style="width: 95%; text-align: start; padding: 2%; line-height: 25px;">
                    <span class="fontStyle">{{ firstContext }}</span>
                    <span class="fontStyle" style="color: #ff0800ff;" onclick="go(rule)">{{ rule }}</span>
                    <span class="fontStyle">,</span>
                    <span class="fontStyle" style="color: #ff0800ff;" onclick="go(privacy)">{{ privacy }}</span>
                    <span class="fontStyle">{{ secondContext }}</span>
                </text>
            </div>
            <div style="height: 15%; width: 100%; flex-direction: row; justify-content: center; align-items: center;">
                <button type="text" style="width: 40%; font-size: 20px; text-align: center; text-color: black;"
                        onclick="noAgree">不同意</button>
                <button type="text" style="width: 40%; font-size: 20px; text-align: center; text-color: #ff0800ff;"
                        onclick="agree">同意</button>
            </div>
        </div>
    </dialog>
<!-- copy  end-->
</div>

index.js文件，在oninit中获取轻量存储文件路径，在onshow中判断是否已同意协议，未同意则弹窗。用户同意则保存同意数据到轻量存储中（要实现用户关联建议使用云存储）

import Router from '@system.router';
import storage from '@ohos.data.storage';
import featureAbility from '@ohos.ability.featureAbility';
export default {
    data: {
        head: "用户隐私条款",
        privacy: "《隐私政策》",
        rule: "《用户协议》",
        firstContext: "       为了更好地保护您的个人信息，我们根据最新的法律法规及相关政策的要求，对隐私条款进行了更新，请您仔细阅读并确认",
        secondContext: "。（特别是加粗及下划线部分），我们会严格按照本协议的约定收集、使用、存储您在" +
        "使用本软件过程中设计的个人信息，以便为您提供更优质的服务，感谢您的信任与理解。\n       如需换行参照此样例实现,如不需要请删除。。。",
        filepath: "",
        imagePath:"/common/images/uncheck.png"
    },
    onInit() {
        var context = featureAbility.getContext();
        context.getFilesDir().then((filePath) => {
            this.filepath = filePath + '/myDatastore';
        })
    },
    onShow() {
        let dataStorage = storage.getStorageSync(this.filepath);
        //方式一：判断页面打开是否需要弹窗
        dataStorage.get("hasAgree", "false").then((value) => {
            if (value == "false") {
                this.$element('dragDialog').show();
            }
        })
    },
    agree() {
        //处理同意的业务
        this.$element('dragDialog').close();
        let dataStorage = storage.getStorageSync(this.filepath);
        dataStorage.putSync("hasAgree", "true");
        dataStorage.flushSync();
    },
    noAgree() {
        //处理不同意的业务
        this.$element('dragDialog').close();
        //允许继续浏览，或选择退出
    },
    
    go(flag) {
        let url = "https://www.51miz.com/so-wendang/11963302.html?utm_term=12452681&utm_source=baidu3&bd_vid=8250967139616741558"
        if (flag == "《用户协议》") {
            url = "https://www.51miz.com/so-wendang/11963302.html?utm_term=12452681&utm_source=baidu3&bd_vid=8250967139616741558"
        }
        else {
            url = "https://www.tukuppt.com/wordmuban/yinsizhengce.html?plan=11177-37593-12085827&bd_vid=8439929694061694080"
        }
        Router.push({
            uri: "pages/detailman/detailman", params: {
                param: url
            }
        })
        this.$element('dragDialog').close();
    },
}

index.css文件：

.container {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
}
.fontStyle{
    font-size: 16px
}

协议详情页面detailman.hml,使用web组件显示H5内容，web组件会覆盖页面其他组件，无法使用组件事件实现回退，如果需要回退可以考虑使用JAVA webView实现

<div class="container">
    <web src="{{param}}"></web>
</div>

detailman.js，定义param变量接受index页面router传过来的参数

export default {
    data: {
        param: ""
    },
    onInit() {
    }
}

detailman.css

.container {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;}

 

【效果展示】

01.gif​

 

【参考样式二】如果元服务需要登录后使用，建议登录界面提供隐私声明提示，引导用户阅读和授权，获取授权后才可继续使用。

cke_108244.png​

代码结构：新建detailman页面用来显示上图超链接跳转的H5页面，index页面是元服务首页，common下新增

cke_117281.png​

实现代码：index.hml文件,因JS UI中不支持checkBox组件，这里使用image来实现选择效果

<div class="container">
<!--方式二：首页使用check框-->
    <div style="flex-direction: row; align-items: center; justify-content: center;">
        <image id="checkImage" style="width: 25px; height: 25px;margin: 3%;" src="{{imagePath}}"
               onclick="agreeCheck"></image>
        <text style="width: 80%; text-align: start; padding: 2%; line-height: 25px;justify-content: center;">
            <span class="fontStyle" style="color: #ff181717;">我已阅读并同意</span>
            <span class="fontStyle" style="color: #ff0800ff;" onclick="go(rule)">{{ rule }}</span>
            <span class="fontStyle">与</span>
            <span class="fontStyle" style="color: #ff0800ff;" onclick="go(privacy)">{{ privacy }}</span>
        </text>
    </div>
</div>

index.js文件，在oninit中获取轻量存储文件路径，在onshow中查询存储数据，初始化check状态。

import Router from '@system.router';
import storage from '@ohos.data.storage';
import featureAbility from '@ohos.ability.featureAbility';
export default {
    data: {
        privacy: "《隐私政策》",
        rule: "《用户协议》",        
        filepath: "",
        imagePath:"/common/images/uncheck.png"
    },
    onInit() {
        var context = featureAbility.getContext();
        context.getFilesDir().then((filePath) => {
            this.filepath = filePath + '/myDatastore';
        })
    },
    onShow() {
        let dataStorage = storage.getStorageSync(this.filepath);
        //方式二：打开页面时初始化用户是否已同意
        dataStorage.get("hasAgree", "false").then((value) => {
            if (value == "false") {
                this.imagePath = "/common/images/uncheck.png"
            }
            else{
                this.imagePath = "/common/images/check.png"
            }
        })
    },
    go(flag) {
        let url = "https://www.51miz.com/so-wendang/11963302.html?utm_term=12452681&utm_source=baidu3&bd_vid=8250967139616741558"
        if (flag == "《用户协议》") {
            url = "https://www.51miz.com/so-wendang/11963302.html?utm_term=12452681&utm_source=baidu3&bd_vid=8250967139616741558"
        }
        else {
            url = "https://www.tukuppt.com/wordmuban/yinsizhengce.html?plan=11177-37593-12085827&bd_vid=8439929694061694080"
        }
        Router.push({
            uri: "pages/detailman/detailman", params: {
                param: url
            }
        }) 
    },
    agreeCheck(){
        let dataStorage = storage.getStorageSync(this.filepath);
        dataStorage.get("hasAgree", "false").then((value) => {
            if (value == "false") {
               //处理同意逻辑并保存已同意参数
                dataStorage.putSync("hasAgree", "true");
                dataStorage.flushSync();
                this.imagePath = "/common/images/check.png"
            }
            else {
                //处理不同意逻辑并保存已同意参数
                dataStorage.putSync("hasAgree", "false");
                dataStorage.flushSync();
                this.imagePath = "/common/images/uncheck.png"
            }

        })
    }}

index.css文件：

.container {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
}
.fontStyle{
    font-size: 16px
}

协议详情页面detailman.hml,参照方式一实现

 

【效果展示】

02.gif​

标签：index,detailman,flex,dataStorage,样例,HarmonyOS,隐私,页面
From： https://www.cnblogs.com/mayism123/p/17553045.html

相关文章

  • 运通App隐私政策
    《运通App隐私政策》（以下简称“本协议”）是【运通科技股份有限公司】（以下简称“我们”）与【运通App】用户（以下简称“用户”或“您”）就“身份实名验证”（以下简称“本服务”）的使用等相关事项所订立的有效合约。您通过网络页面点击确认或以其他方式选择接受本协议，即表示您与我们已达......
  • 一文读懂苹果的差分隐私技术原理
    在2016年6月份的苹果WWDC大会上提到了一项差分隐私技术（DifferentialPrivacy），其作用是对用户的数据进行扰动，然后上传到苹果服务器。苹果能通过这些扰动过的数据计算出用户群体的行为模式，但是对每个用户个体的数据却无法解析。苹果通过采用差分隐私技术，实现了在不得到用户......
  • 【HarmonyOS】【FAQ】HarmonyOS应用开发相关问题解答（三）
    ​贴接上回。。。 【往期FAQ参考】【HarmonyOS】【FAQ】HarmonyOS应用开发相关问题解答（一）【HarmonyOS】【FAQ】HarmonyOS应用开发相关问题解答（二） 【本期FAQ】1、第一次调用geolocation.getCurrentLocation()接口，弹出权限弹框后并未返回结果，再次调用接口才会成功返回？（API8......
  • 盘点！国内隐私计算学者在 USENIX Security 2023 顶会上的成果
    USENIXSecurity是国际公认的网络安全与隐私计算领域的四大顶级学术会议之一、CCF(中国计算机学会)推荐的A类会议。每年的USENIXSecurity研讨会都会汇集大量研究人员、从业人员、系统管理员、系统程序员和其他对计算机系统、网络安全和隐私最新进展感兴趣的人。近日，在......
  • im私有化部署：保障企业内部数据安全与隐私的首选方案
    随着信息技术的迅猛发展，即时通讯（IM）已成为人们生活和工作中不可或缺的一部分。然而，随之而来的数据安全和隐私问题也日益突出。为了应对这一挑战，越来越多的组织和企业开始采用IM私有化部署方案，以保障数据安全与隐私。  IM私有化部署是指将即时通讯系统部署在企业自有的服务器......
  • VCS 仿真脚本makefile样例
    详细的参数介绍参考下面的博客https://www.cnblogs.com/csjt/p/15581396.html自己的makefile，注意 SEED=`date+%N`//随机种子的定义取时间SIM_COV=-cmline+cond+fsm+tgl+branch//代码覆盖率采样的定义 TESTLIST=ahb_mst_burstahb_mst_single_read32ahb_......
  • 【HarmonyOS】元服务启动命令漫谈
    ​在日常开发中，我们可以通过DevEcoStudio，直接Run我们的元服务工程，在测试机上拉起我们开发的元服务页面。但是我们自己打包HarmonyOS元服务hap在手机上安装后是没有桌面图标的。虽然我们可以在设置的服务管理中找到我们安装的元服务，但是无法直接打开，这就需要通过命令行的方式来启......
  • App隐私合规学习驿站
    一、法律法规法律位阶：https://www.cnblogs.com/ffx1/p/15953880.html有助于对监管机构的全面认识，如：执法力度和强度、企业对其重视的优先级等。法规清单https://www.cnblogs.com/ffx1/p/16716477.htmlhttps://www.cnblogs.com/ffx1/p/16695161.html二、查询平台【信......
  • 【直播预告】HarmonyOS极客松赋能直播第四期：HarmonyOS开发经验分享
        ......
  • YinQingfox跨境电商防关联指纹浏览器：保护您的隐私安全
    随着互联网和电子商务的迅猛发展，跨境电商成为了商业领域中的重要一环。然而，在享受跨境电商便利的同时，我们也要面对隐私泄露和个人信息安全的风险。为了解决这一问题，YinQingfox推出了一款创新的跨境电商浏览器——YinQingfox跨境电商防关联指纹浏览器，它将保护您的隐私安全放在首位。......

赞助商

阅读排行

网站主页关于我们联系我们网站地图

本网站内容转载自其他媒体，侵权联系[admin##ips99.com]。

Copyright © 2020-2023 IPS99 版权所有 IPS99