From 36b08661e174d94fe5d2361fb1ba39a299e1c6d7 Mon Sep 17 00:00:00 2001 From: taohebin Date: Sat, 8 Jul 2023 18:48:26 +0800 Subject: [PATCH] =?UTF-8?q?=E8=A1=A5=E5=85=85=E9=95=BF=E5=88=97=E8=A1=A8?= =?UTF-8?q?=E8=AF=A6=E6=83=85=E7=A4=BA=E4=BE=8B?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- pages/component/long-list/detail/detail.uvue | 52 +++++--- pages/component/long-list/long-list.uvue | 4 +- static/list-mock/mock.json | 133 ++++++++++++++++--- 3 files changed, 148 insertions(+), 41 deletions(-) diff --git a/pages/component/long-list/detail/detail.uvue b/pages/component/long-list/detail/detail.uvue index 8183fd03..49f09db3 100644 --- a/pages/component/long-list/detail/detail.uvue +++ b/pages/component/long-list/detail/detail.uvue @@ -1,22 +1,30 @@ - - - - - + + + + + diff --git a/pages/component/long-list/long-list.uvue b/pages/component/long-list/long-list.uvue index cdd0496a..9e5fb25c 100644 --- a/pages/component/long-list/long-list.uvue +++ b/pages/component/long-list/long-list.uvue @@ -53,7 +53,6 @@ import JSONObject from 'com.alibaba.fastjson.JSONObject'; const jsonArr = JSON.parse(content); jsonArr?.forEach((res)=>{ const json = res as JSONObject; - console.log("json :",json); const title = json["title"] as string; const subTitle = json["subTitle"] as string; const img = json["img"] as string; @@ -71,7 +70,6 @@ import JSONObject from 'com.alibaba.fastjson.JSONObject'; temp = temp.concat(items); } listData = temp; - console.log("size :",listData.size); } setTimeout(()=>{ @@ -80,7 +78,7 @@ import JSONObject from 'com.alibaba.fastjson.JSONObject'; }, goDetail(e: Item) { uni.navigateTo({ - url: 'pages/component/long-list/detail/detail' + url: 'pages/component/long-list/detail/detail?content=' + e.detail }); }, onRefresherrefresh() { diff --git a/static/list-mock/mock.json b/static/list-mock/mock.json index 217847fa..3fb0f064 100644 --- a/static/list-mock/mock.json +++ b/static/list-mock/mock.json @@ -1,17 +1,118 @@ [{ - "title": "灵魂拷问：你做的应用安全吗？", - "subTitle": "功能都能实现，至于安全嘛", - "img": "static/list-mock/safe.png", - "detail": "12345678" -},{ - "title": "云对象-重新定义前后端交互", - "subTitle": "更清晰的逻辑、更少的代码、更低的协作成本、更好的语法提示", - "img": "static/list-mock/unicloud.png", - "detail": "12345678" -}, -{ - "title": "庆贺：uni-app海外月活设备过亿", - "subTitle": "2022，让我们卷向海外吧", - "img": "static/list-mock/internation.png", - "detail": "12345678" -}] \ No newline at end of file + "title": "灵魂拷问：你做的应用安全吗？", + "subTitle": "功能都能实现，至于安全嘛", + "img": "static/list-mock/safe.png", + "detail": "每个工程师，每个测试人员，在验收项目的时候，对功能需求的满足，心里是有底的。甚至也可以模拟大并发来测试应用的性能。 + 但要问你交付的应用是否安全？ 那不管工程师还是测试， 心里都没底 + 安全是一个独立且专业的事情， 如果不是一个优秀的黑客， 很难发现应用的众多安全问题。 + 普通工程师和测试人员是无法达到这个水平的。 + 由于http的无状态特性， 服务器很难识别客户端的真伪。 这是一个真实请求， 还是伪造的假客户端？ 一个貌似简单的识别问题， 难住了很多人。 + 网络传输的数据， 在中间被各种路由器和不规范的运营商偷窃和劫持。 + 如果您的应用有如下特征， 就非常容易被黑客盯上： + 1. 应用中有大量有价值的数据 + 2. 提供优惠、 促销 + 3. 提供激励视频等奖励分发 + 攻击者为了你的数据， 或者为了褥你的羊毛， 可以破解你的网络请求、 伪造假的客户端去请求你的服务器。 + 你原本期待给正常用户提供福利， 以拉新或促活， 结果一场促销后， 正常用户没得到好处， 全给黑客褥走了。 + 让普通工程师和测试人员具备黑客能力是不现实的， DCloud为开发者赋能， 解决了这些安全顾虑。 + 在uni安全网络里， 可靠解决了如下2个老大难问题： 如何确认这个客户端， 真的是你的合法客户端？ + 客户端和服务器的通信， 如何安全加密？ + 在过去， 客户端和服务器是强分离的， 它们使用不同的技术开发， 中间通过无状态的http协议交流。 + 现在， DCloud同时提供了端引擎uni - app和云引擎uniCloud， 统一了技术栈， 在uni - app开发的客户端和uniCloud开发的服务器之间， 使用了更安全的网络通信机制。 + 安全网络仅支持App和微信小程序。 其他小程序和web无法保证客户端不被伪造。 + 使用步骤： + 1. 在uniCloud控制台选定服务空间， 在安全网络设置页面绑定uni - app的客户端appid + 2. 使用DCloud云打包来打包这个appid的客户端（ 要在manifest勾选安全网络模块） + + 这样， 这个客户端和这个服务空间之间就建立了安全网络。 云端可以准确识别客户端的真伪， 可以在uniCloud控制台直接设置拒绝非法客户端连接您的服务空间。 + 这条安全网络， 几乎不会对请求速度等性能指标产生影响， 同时又可以识别假客户端、 马甲包。 + 另外， 还可以在指定的网络请求中做内容加密。 不管是云对象请求还是云函数的callFunction， 都可以设置secret（ 一个bool参数） 来对通信内容加密。 + secret参数设为true时， 这些内容将被加密传输， 无法被中间的路由器或伪造客户端解密。 + 注意内容加密是影响请求速度的， 加解密耗时与内容的数据量有关。 数据量小时， 可以忽略影响； 数据量大时， 需自己进行实际测试来评估体验。 + uni安全网络还可以鉴别客户端的包名、 签名证书， 识别客户端设备是否被root或越狱， 禁止非法设备访问。 + uni安全网络需要开发者在uniCloud上开通， 但并不收费。 + 如此高安全的保障， 在商业项目中都需要花掉不少银子来采购。 但DCloud免费给uniCloud开发者提供。 " + }, { + "title": "云对象-重新定义前后端交互", + "subTitle": "更清晰的逻辑、更少的代码、更低的协作成本、更好的语法提示", + "img": "static/list-mock/unicloud.png", + "detail": "从2000年开始，xml作为数据交换格式开始流行，服务器拼接xml接口，客户端js获取xml内容，动态修改页面。 + 几年后， 数据量更小的json替代了xml。 + 移动互联网到来后， 因为客户端分裂， 加剧了接口的泛滥。 + 一转眼， 接口已经玩了20年了。 其他技术飞速发展， 而前后端交互却一直是接口， 没有什么创新。 + js已经有了import、 + export， 为什么调用后端接口， 不能像调用一个前端模块一样呢？ + serverless， 让这一切开始了变化。 + 亚马逊lambda提出了云函数的概念， 不再使用restful的url， 但仍然是基于json交换前后端数据。 + uniCloud最初也以支持云函数为开始， 但我们发现这仍不够优雅、 简洁、 直观、 统一。 + 从HBuilderX 3.4 开始， uniCloud推出了“ 云对象”， 让调用云端服务， 真正变成像调用前端模块一样简单。 + 云对象： 服务器编写API， 客户端调用API， 不再开发传输json的接口。 思路更清晰、 代码更精简。 + 比如服务端编写一个云对象news， 该对象导出若干方法： add()、 getList()、 getDetailById()、 softDel()、 changeContent()、 allowPublic()、 addComment()、 getComments() + ...等。 + 客户端的js则可以 + import 这个news云对象， 然后直接调用add等方法。 + HBuilderX中在uniCloud / cloudfunctions目录新建云函数 / 云对象， 选择类型为云对象， 起名为news。 打开云对象入口index.obj.js， 导出一个add方法。 + 然后在客户端的js中， import这个news对象， 调用它的add方法。 + 更多强大功能 + 1. 预处理与后处理 + 无论请求云对象的哪个方法， 开始前都会经过_before方法， 结束会执行_after方法。 这有助于统一的提前校验和格式化错误。 + 2. 云对象的返回值兼容uniCloud响应体规范 + 云对象返回值默认为uniCloud响应体规范， 方便客户端统一拦截错误。 + 无论网络异常， 还是token过期， 都可以统一拦截提示。 + 详见uniCloud响应体规范 + 3. 自动显示交互界面 + 每次写客户端联网的代码时， 开发者都免不了重复写一堆代码： 先调用loading等待框， 联网结束后再关闭loading， 如果服务器异常则弹出提示框。 + 当然， 这些UI策略都可以自定义。 + 4. URL化 + 为了历史兼容考虑， 云对象同时提供了URL化方案。 开发者仍然可以把一个云对象转换为一个http的url接口。 + 总结 + 使用云对象带来的诸多好处： + 1. 更清晰的逻辑 + 2. 更精简的代码 + 3. 更少的协作成本（ 以及矛盾图片） + 4. 客户端调用时在ide里有完善的代码提示， 方法参数均可提示。（ 传输json可没法在ide里提示） + 5. 自动支持uniCloud响应体规范， 方便错误拦截和统一处理 " + }, + { + "title": "庆贺：uni-app海外月活设备过亿", + "subTitle": "2022，让我们卷向海外吧", + "img": "static/list-mock/internation.png", + "detail": "在刚过去的4月，uni-app 在中国以外的国家，无论以 uv 还是以 ip 口径统计，月活跃设备均突破 1亿 大关。 + 平台方面， 这些活跃设备主要来自于 App 和 web， 也有小部分小程序。 + 国家分布方面， 遍布全球两百多个国家， 各大洲、 各种语言均有分布。 + 用户量排名靠前的前10个国家是： 印度、 美国、 菲律宾、 巴西、 印度尼西亚、 尼日利亚、 土耳其、 越南、 马来西亚、 英国。 + 这些应用有海外开发者开发的当地应用， 但大部分应用是由中国开发者开发的出海应用。 + 作为世界工厂的中国， 制造能力向海外溢出； 而另一方面， 中国的数字化开发能力也在向海外加速溢出。 坦白讲， 中国的开发工程师数量、 数字应用制造能力， 对全球大多数国家而言不是一个级别的。 + 在过去一年里， DCloud在国际化方面做了很多事， 不管是HBuilder、 uni - app、 还是uniCloud， 均提供了国际化方案， 帮助中国开发者更便利的出海。 + 一、 HBuilder推出英文版 + 除了中英文， HBuilder还开放制作各国语言包， 支持双向文字流， 即从右向左的文字。 + uni - app全面支持国际化 + 1. 从前端到原生均支持国际化 + 2. 从应用到框架均支持国际化 + 3. 从vue到nvue均支持国际化 + 4. 双向文字流。 从右向左的文字比如阿拉伯文也可以正常显示 + 5. 海外主流sdk支持： 开发者出海不止需要多语言， 海外的主流SDK适配也是必需品。 uni - app 的map、 pay、 login、 push均支持海外主流SDK。 + H5、 App平台 Google地图 + App平台 支付支持 Paypal、 Stripe、 Google Pay、 Apple IAP + App平台 登录支持 Google、 Apple、 Facebook + App平台 推送支持 Google FCM + 插件市场还有众多其他海外SDK的支持插件 + + DCloud提供了 hello i18n 示例来演示各种国际化使用方法。 + 可以在 HBuilder 新建项目界面 获取 hello i18n 示例， 也可以在插件市场下载： https: //ext.dcloud.net.cn/plugin?id=6462 + uniCloud终端用户可视数据国际化 + uniCloud的 DB Schema 中涉及字段的显示名称、 错误格式提示语， 这些也均支持国际化。 + uniCloud阿里云版也支持海外加速。 + + - + 配套开源生态的国际化 + + uni ui、 uni - starter、 uni - admin等重要开源项目均支持国际化。 + + 中国的数字应用数量， 已经是世界顶级。 活跃的app、 小程序、 web网站， 数量上千万。 庞大的需求孕育出庞大的生产能力。 + 中国仍然有很多机会， 但已经内卷严重。 与此同时， 其他国家其实也迫切的需要数字化， 他们需要中国的数字应用制造能力。 + DCloud已经为开发出海应用制作了大量轮子。 今年的插件大赛， DCloud还将设立专门预算奖励支持国际化的优秀插件。 + 现在天时地利都具备， 就等你来开发应用了！ + 2022， 让我们卷向海外吧。 " + } +] \ No newline at end of file -- GitLab