技术干货 | mPaaS 小程序高玩带你起飞:客户端预置小程序无视网络质量
简介: 弱网拉包无障碍,深度提升用户体验
传统的小程序技术容易受到网络环境影响,当网络质量不佳时可能导致拉取不到小程序包的情况。通过预置小程序,即可规避该问题。本文介绍了预置小程序的原理和预置小程序的实现过程。
什么是预置小程序
预置小程序是指将小程序的渲染、逻辑、配置等静态资源打包在一个压缩包内,客户端预先下载小程序包到本地、直接从本地加载资源的过程。预置小程序可以最大程度地摆脱网络环境对 mPaaS 小程序页面的影响。使用预置包能够为客户端带来以下优势:
- 提升用户体验
通过预置包的方式把页面内静态资源嵌入到应用中并随应用一起发布,可以使用户第一次开启应用时即无需依赖网络环境下载资源,可以直接开始使用。
- 实现动态更新
在推出新版本或紧急发布的时候,可以在小程序 IDE 中进行迭代开发,通过 mPaaS 控制台发布,客户端中集成的小程序 SDK 会自动将小程序更新到最新的版本。这种发布无需通过应用商店审核,可以让用户及早接收到更新。
预置小程序的实现原理
本文从以下方面介绍了预置小程序的实现原理:
- 小程序预置包的结构
- 小程序预置包的使用过程
小程序预置包的结构
小程序预置包是一个 .amr 格式的压缩文件,将后缀 amr 改成 zip 解压缩后,可以看到其中包含的 HTML 资源和 JavaScript 代码等。待小程序容器加载后,这些资源和代码能在 UC 内核渲染。
以 Android 系统为例,下图显示了一般资源包的目录结构:
- 一级目录:一般为资源包的 ID,如 2020121620201216_1.0.1.0.zip。
- 二级目录及往后即为业务自定义的资源文件。并设定当前预置包默认打开的主入口文件,如 /index.html。
小程序预置包的使用过程
使用小程序预置包的过程可以分为以下三个步骤:
- 请求包信息
从服务端请求小程序包,并将小程序包信息存储到本地数据库的过程。包信息包含了小程序包的下载地址、小程序包版本号等。 - 下载小程序包
把小程序包从服务端下载到手机。 - 安装小程序包
下载目录,拷贝到手机安装目录。
前提条件
- 已接入小程序组件。更多关于小程序组件的接入信息,请参见 快速开始使用小程序。
- 已接入 H5 容器 组件。更多关于 H5 容器的接入信息,请参见 快速开始使用 H5 容器。
操作步骤-Android
- 预置小程序包。
- 在 mPaaS 控制台发布小程序包并下载 AMR 文件和配置文件。
将下载到的 AMR 文件和配置文件放置在 mPaaS 项目的 assets 目录下。
在工程中添加预置代码,以在应用启动时调用预置代码安装应用。预置代码示例如下:
new Thread(new Runnable(){
@Override
public void run(){
MPNebula.loadofflineNebula(jsonFileName: "h5_json.json",
new MPNebulaOfflineInfo(offLineFileName:"2020121620201216_1.0.1.0.amr",
addId:"2020121620201216",
version:"1.0.1.0"));
}
}).start();
说明:
- 此方法为阻塞调用,请不要在主线程上调用内置预置包方法。
- 此方法仅能调用一次。若多次调用,仅第一次调用有效。所以需要一次性传入所有需预置预置包信息。
- 如果内置多个 AMR 包,需要要确保文件已存在;如不存在,会造成其他内置预置包失败。
- 启动小程序。启动小程序的示例代码如下。
/**
* 启动小程序
*
* @param appId 小程序id
*/
public static void startApp(String appId);
- 更新小程序
默认情况下,每次打开应用,小程序 SDK 都会尝试检查是否有可更新的版本。出于服务端压力考虑,该检查有时间间隔限制,默认为 30 分钟。如果想立即检查最新可用版本,调用下方的代码来请求更新。一般情况下,可以在应用启动或者用户登录后调用。
MPNebula.updateAllApp(new MpaasNebulaUpdateCallback(){
@Override
public void onResult(final boolean success, final boolean isLimit) {
super.onResult(success, isLimit);
runOnUiThread(new Runnable() {
@Override
public void run() {
AUToast.makeToast(NebulaAppActivity.this,
success ? R.string.update_success : R.string.update_failure, 2000).show();
}
});
}
});
结语
mPaaS 小程序源自于支付宝小程序框架,亿级线上业务体量的锤炼,安全性媲美支付宝原生能力。不仅面向自有 App 投放小程序,更可快速构建打包,覆盖支付宝、淘宝、钉钉等应用。
通过使用上述预置小程序的方案,预置小程序不仅可以最大程度地摆脱网络环境对 mPaaS 小程序页面的影响,还能深度体验用户体验、实现动态更新。
mPaaS 小程序(Alpha)限时免费申领中,全新内核完全对齐支付宝标准 API,为您提供更精简的安卓端 SDK。
作者:查克拉空
本文为阿里云原创内容,未经允许不得转载
技术干货 | mPaaS 小程序高玩带你起飞:客户端预置小程序无视网络质量的更多相关文章
- 神探Python程序员,带你千里捉小三!(附详情代码)
前言 本文的文字及图片来源于网络,仅供学习.交流使用,不具有任何商业用途,版权归原作者所有,如有问题请及时联系我们以作处理. 作者: 王翔 清风Python PS:如有需要Python学习资料的小伙伴 ...
- 技术干货 | 轻松两步完成向 mPaaS 小程序传递启动参数
前言 在部分场景下,需要向小程序的默认接收页(pages/index/index)传递参数. 本文将以传递 name 和 pwd 参数为例,分别介绍此场景在 Android 小程序和 iOS 小程序中 ...
- 【纯·技术干货】更 App 化的小程序开发
2018 年 10 月13 日,由又拍云和知晓云联合主办的 Open Talk 丨2018 小程序开发者沙龙系列活动广州站拉开帷幕,糗事百科前端负责人宋航在沙龙上做了<更App化的小程序开发&g ...
- 分享iOS开发常用(三方类库,工具,高仿APP,实用网站,技术干货)
一 . JSONModel (三方类库会有更新,建议大家在线下载) http://pan.baidu.com/s/1i5ybP1z 二.AFNetworkiong http://pan.baidu. ...
- 微信小程序如何玩转分销
截止目前,微信月活跃用户已经高达8.89亿,微信这个庞大的互联网巨头下一个目标是什么? 打造属于自己的“AppStore”.小程序正是完成这个微信生态体系的一块完美拼板, 张小龙预言:未来2年内,小程 ...
- 微信小程序支付,带java源码
先说下这个的背景吧... 本人是做java后端的,自认为还有很大的发展空间(嘻嘻,你懂的),看过一段时间的小程序可是没有支付成功...最近公司要做小程序项目,老大让我看下小程序,折腾了好几天,参照着h ...
- 结对编程——带UI的小初高数学学习软件
一.简介 本次项目要求: 1.所有功能通过图形化界面操作,可以是桌面应用,可以是网站(编程语言和技术不限): 2.用户注册功能.用户提供手机号码,点击注册将收到一个注册码,用户可使用该注册码完成注册: ...
- 带UI的小初高数学学习软件—艰难地用C++(QT库)实现的过程
从互相了解对方的代码思路然后确定用C++编写,到用win32写界面时变得摇摆不定的考虑着要不要改变语言,再到用QT写完界面后发现短信接口一般都不提供C++,最后到QT打包出来的可执行文件在别的设备上无 ...
- 如何玩转小程序+公众号?手把手教你JeeWx小程序CMS与公众号关联
随着微信小程序新功能.新入口的不断更新,小程序的商业价值逐步增强,特别是小程序与公众号的深度融合,已经让小程序成为各行业新的营销渠道.Jeewx平台专注小程序的开发,逐步完善小程序生态圈,通过简单操作 ...
- 【Bugly技术干货】那些年我们用过的显示性能指标
Bugly 技术干货系列内容主要涉及移动开发方向,是由 Bugly 邀请腾讯内部各位技术大咖,通过日常工作经验的总结以及感悟撰写而成,内容均属原创,转载请标明出处. 前言: 注:Google 在自己文 ...
随机推荐
- new vs malloc
https://www.cnblogs.com/qg-whz/p/5140930.html 1.申请内存位置 new操作符从自由存储区(free store)上为对象动态分配内存空间,而malloc函 ...
- String内存模型和Java常用方法
一.String内存模型 1.直接赋值创建string对象内存原理: StringTable(串池):字符串常量池,用来存储字符串,只能是在直接赋值中使用才会存在串池当中(JDK7前串池是在方法区里面 ...
- [极客大挑战 2019]web部分题解(sql部分已完结,其他部分正在更新,出去吃个饭先)
[极客大挑战 2019]BabySQL 打开环境后有登录界面◕‿◕ 一眼注入,后先试试万能密码: username:admin' or '1'='1 password:1 GG,出大问题,我就会这一招 ...
- WPF 模仿微信顶部断网提示气泡
直接看顶部气泡的效果吧 顶部气泡主要要做三个工作 1.定位到顶部居中 2.气泡需要跟随窗体 3.气泡不可以遮挡住其他程序界面 原生的WPF Poupu控件不会跟随目标移动且在Z轴上会置顶,所以存在打开 ...
- 【IOT安全】ASA5520基本知识和配置
本文主要介绍ASA5520防火墙的基本知识和配置 环境搭建 Linux eveng 5.17.8-eve-ng-uksm-wg+ #1 SMP PREEMPT Mon May 16 10:08:59 ...
- Python爬虫爬取京东某商品评论信息存入mysql数据库
1 """ 2 https://club.jd.com/comment/productPageComments.action?callback=fetchJSON_com ...
- Python正则表达式提取方法
- Azkaban 2.5 Documentation
Overview Azkaban was implemented at LinkedIn to solve the problem of Hadoop job dependencies. We had ...
- 4 HTML表格标签
4 表格标签 表格标签也是一种复合标签.由:table,tr,td,th,thead,tbody组合,由行和列组合成,行和列交叉的地方就是单元格.在HTML中使用table来定义表格.网页的表格和办公 ...
- Codeforces Round #682 (Div. 2)
CF1438A Specific Tastes of Andre 洛谷传送门 CF1438A 代码(全铺成1就可以了) #include <cstdio> #include <cct ...