Traditional small program technology is easily affected by the network environment, and when the network quality is not good, it may lead to the situation that the small program package cannot be pulled. This problem can be circumvented by pre-setting small programs. This article introduces the principle of the preset applet and the realization process of the preset applet.
What is a pre-built applet
The pre-built applet refers to the process of packaging the static resources such as the rendering, logic, and configuration of the applet in a compressed package, and the client pre-downloads the applet package to the local and loads the resources directly from the local. The pre-built applet can get rid of the influence of the network environment on the mPaaS applet page to the greatest extent. The use of preset packages can bring the following advantages to the client:
- Improving user experience
By embedding the static resources in the page into the application and publishing it with the application by means of a pre-packaged method, the user can directly start using the application without relying on the network environment to download the resources when starting the application for the first time. - Realization of dynamic update
When a new version or emergency release is launched, iterative development can be carried out in the applet IDE and released through the mPaaS console. The applet SDK integrated in the client will automatically update the applet to the latest version. This kind of release does not require app store review, allowing users to receive updates early.
The realization principle of the preset applet
This article introduces the realization principle of the preset applet from the following aspects:
- The structure of the applet preset package
- Use process of mini program preset package
Applet Sequence preset packet structure
Applet preset package is a compressed file format, the suffix changed after decompression, you can see the HTML resource contains JavaScript code and so on. After the applet container is loaded, these resources and codes can be rendered in the UC kernel..amramrzip
Taking the Android system as an example, the following figure shows the directory structure of a general resource package:
- First-level directory: generally the ID of the resource package, such as 2020121620201216_1.0.1.0.zip.
- The second-level directory and later are the resource files customized by the business. And set the main entry file that is opened by default in the current preset package, such as .
/index.html
Use process of mini program preset package
The process of using the mini program preset package can be divided into the following three steps:
- Request package information The
process of requesting a small program package from the server and storing the small program package information in a local database. Information package contains the applet Download the package, applets package version number. - Download the small program package Download
the small program package from the server to the mobile phone. - Install the small program package
download directory and copy it to the phone installation directory.
Prerequisites
- The applet component has been connected. For more information on small access program components, see the quick start using the applet .
- H5 container components have been connected. More about H5 container access information, see Get started quickly with H5 container .
Operation steps-Android
- Pre-built small program package.
a. Publish the small program package on the mPaaS console and download the AMR file and configuration file.
b. Place the downloaded AMR file and configuration file in the assets directory of the mPaaS project .
c. Add preset code to the project to call the preset code to install the application when the application starts. Examples of preset codes are as follows:
Description :
-
- 此方法为阻塞调用，请不要在主线程上调用内置预置包方法。
- 此方法仅能调用一次。若多次调用，仅第一次调用有效。所以需要一次性传入所有需预置预置包信息。
- 如果内置多个 AMR 包，需要要确保文件已存在；如不存在，会造成其他内置预置包失败。
2. 启动小程序。启动小程序的示例代码如下。
默认情况下，每次打开应用，小程序 SDK 都会尝试检查是否有可更新的版本。出于服务端压力考虑，该检查有时间间隔限制，默认为 30 分钟。如果想立即检查最新可用版本，调用下方的代码来请求更新。一般情况下，可以在应用启动或者用户登录后调用。
4. 校验安全签名
小程序具有签名校验机制，防止恶意程序篡改下载到设备的小程序包。通过调用MPNebula
接口设置验签参数即可开启此机制。如果您使用的基线是 10.1.60 或以上版本，需要额外开启容器配置，详情参见
H5 容器配置
。
说明：
-
- 请在第一次打开离线包前调用
MPNebula接口，否则将会导致公钥初始化失败。关于公钥与私钥，参见 配置离线包 > 密钥管理。 - 无论客户端是否开启签名校验，在被判断为 root 的手机上都会强制进行签名校验。
- 请在第一次打开离线包前调用
5. 删除本地小程序
Nebula 提供了删除本地应用信息的接口。当本地应用信息被删除后，再次打开应用时会重新请求服务端下载、更新本地小程序的信息。
说明：此 API 在 10.1.68 系列和 10.1.60 系列支持的最低基线版本分别为 10.1.68.8 和 10.1.60.14 。
操作步骤-iOS
- 预置小程序包。
a. 在 mPaaS 控制台发布小程序包并下载 AMR 文件和配置文件。
b. 新建一个独立的 bundle，如 DemoCustomPresetApps.bundle，将从发布平台下载的 .amr 离线包和 h5_json.json 文件添加到此 bundle 中。
重要：目前发布平台仅支持下载单个离线包的 h5_json.json 配置文件。当预置多个小程序包时，需要将不同 h5_json.json中的 data 数据手动合并到一个配置文件中。
c. 在初始化小程序时,在initNebulaWithCustomPresetApplistPath 接口，设置预置小程序离线包路径为上一步中创建的 bundle。
与非预置小程序类似，进入对应的页面时，调用 Nebula 容器提供的接口方法加载小程序。
默认情况下，每次打开应用，小程序 SDK 都会尝试检查是否有可更新的版本。出于减少服务端压力的考虑，该检查有时间间隔限制，默认为 30 分钟。如果想立即检查最新可用版本，可调用下方的代码来请求更新。一般情况下，可以在应用启动或者用户登录后调用。
小程序具有签名校验机制，防止恶意程序篡改下载到设备的小程序包。通过调用 小程序 接口设置验签参数即可开启此机制。
说明：
-
- 请在第一次打开小程序包前调用 MPNebulaAdapterInterface 接口，否则将会导致公钥初始化失败。关于公钥与私钥，请参见 配置小程序包 > 密钥管理。
- 开启验签
- 请在第一次打开小程序包前调用 MPNebulaAdapterInterface 接口，否则将会导致公钥初始化失败。关于公钥与私钥，请参见 配置小程序包 > 密钥管理。
Nebula 提供了删除本地应用信息的接口。当本地应用信息被删除后，再次打开应用时会重新请求服务端下载、更新本地小程序的信息。
结语
The mPaaS applet is derived from the Alipay applet framework, with a hundred million-level online business volume, and its security is comparable to Alipay's native capabilities. Not only can we launch small programs for our own apps, but we can also quickly build and package them, covering applications such as Alipay, Taobao, and Dingding.
By using the above-mentioned pre-built applet solution, the pre-built applet can not only get rid of the influence of the network environment on the mPaaS applet page to the greatest extent, but also experience the user experience in depth and realize dynamic updates.
Written by: Liu Qiyang, Teng Hongcai
- END -
