管理離線包
傳統(tǒng)的在線 H5 技術(shù)容易受到網(wǎng)絡(luò)環(huán)境影響,從而影響 H5 頁面的性能。為此,您可以將不同的業(yè)務(wù)封裝打包成一個(gè)離線包,通過發(fā)布平臺(tái)下發(fā)對(duì)客戶端資源進(jìn)行更新。
本文將引導(dǎo)您管理離線包:
前置條件
您需要確保完成 SDK 添加后,客戶端工程已集成 NebulamPaaSBiz.framework
。
生成離線包
為了生成 .amr
離線包,您需要構(gòu)建前端 .zip
包并在線生成 .amr
包。具體的操作步驟,請(qǐng)參見文檔 生成離線包。
加載離線包
根據(jù)是否在客戶端預(yù)置離線包,分為以下兩種方式:
預(yù)置離線包
不管網(wǎng)絡(luò)情況如何,首頁或登錄頁等頁面都需快速加載。因此,可以將這部分資源打包為離線包、提前預(yù)置在工程中,以保證在離線情況下資源也能快速加載。
具體步驟如下:
新建一個(gè)獨(dú)立的 bundle,如
DemoCustomPresetApps.bundle
,將從發(fā)布平臺(tái)下載的.amr
離線包和h5_json.json
文件添加到此 bundle 中。說明目前發(fā)布平臺(tái)僅支持下載單個(gè)離線包的
h5_json.json
配置文件。當(dāng)預(yù)置多個(gè)離線包時(shí),需要手動(dòng)合并到 JSON 文件中的 data 數(shù)組。在初始化容器時(shí),調(diào)用
initNebulaWithCustomPresetApplistPath
接口,設(shè)置預(yù)置離線包路徑為上一步中創(chuàng)建的 bundle。- (void)application:(UIApplication *)application beforeDidFinishLaunchingWithOptions:(NSDictionary *)launchOptions { // 初始化 rpc [MPRpcInterface initRpc]; // 初始化容器 // [MPNebulaAdapterInterface initNebula]; // 自定義 jsapi 路徑和預(yù)置離線包信息 NSString *presetApplistPath = [[NSBundle mainBundle] pathForResource:[NSString stringWithFormat:@"DemoCustomPresetApps.bundle/h5_json.json"] ofType:nil]; NSString *appPackagePath = [[NSBundle mainBundle] pathForResource:[NSString stringWithFormat:@"DemoCustomPresetApps.bundle"] ofType:nil]; NSString *pluginsJsapisPath = [[NSBundle mainBundle] pathForResource:[NSString stringWithFormat:@"DemoCustomPlugins.bundle/Poseidon-UserDefine-Extra-Config.plist"] ofType:nil]; [MPNebulaAdapterInterface initNebulaWithCustomPresetApplistPath:presetApplistPath customPresetAppPackagePath:appPackagePath customPluginsJsapisPath:pluginsJsapisPath]; }
與加載非預(yù)置離線包類似,進(jìn)入對(duì)應(yīng)的頁面時(shí),調(diào)用 Nebula 容器提供的接口方法加載離線包。
- (void)openPresetPackage { [[MPNebulaAdapterInterface shareInstance] startH5ViewControllerWithNebulaApp:@{@"appId":@"20180910"}]; }
加載遠(yuǎn)程離線包
除將離線包預(yù)置在客戶端外,您還可以通過發(fā)布平臺(tái)動(dòng)態(tài)發(fā)布一個(gè)離線包。這樣,客戶端就可以直接加載遠(yuǎn)程離線包,避免了預(yù)置大量離線包導(dǎo)致客戶端包體積過大的問題。
具體步驟如下:
在應(yīng)用啟動(dòng)完成后,可以預(yù)加載獲取包信息并下載離線包,防止打開離線包時(shí)白屏。
代碼示例
[[MPNebulaAdapterInterface shareInstance] requestAllNebulaApps:^(NSDictionary *data, NSError *error) { NSLog(@"[mpaas] nebula rpc data :%@", data); }];
接口方法
@interface MPNebulaAdapterInterface : NSObject /** * 全量更新本地離線包信息 * * @param finish 完成回調(diào) * */ - (void)requestAllNebulaApps:(NAMRequestFinish)finish; /** * 單個(gè)應(yīng)用請(qǐng)求 * * @param params 請(qǐng)求列表,格式為{appid:version}??蓚鞫鄠€(gè) appid,版本號(hào)最長 4 位,如 1.0.0.1;不指定 version 時(shí)傳空,默認(rèn)取最高版本;支持版本號(hào)模糊匹配,如: '*' 匹配最高版本號(hào)、'1.*' 匹配以 1 開頭的版本號(hào)中最高的版本號(hào) * @param finish 完成回調(diào) */ - (void)requestNebulaAppsWithParams:(NSDictionary *)params finish:(NAMRequestFinish)finish; @end
客戶端配置完成后,您可以通過發(fā)布平臺(tái)下發(fā)一個(gè)離線包,具體的操作步驟,請(qǐng)參見 實(shí)時(shí)發(fā)布 > 離線包管理 > 發(fā)布離線包 。
進(jìn)入對(duì)應(yīng)的頁面時(shí),調(diào)用 Nebula 容器提供的接口方法加載離線包,即可看到您在發(fā)布平臺(tái)下發(fā)的離線包。
代碼示例
- (void)openPresetPackage { [[MPNebulaAdapterInterface shareInstance] startH5ViewControllerWithNebulaApp:@{@"appId":@"20180910"}]; }
接口方法
@interface MPNebulaAdapterInterface : NSObject /** * 基于傳入的離線包信息,創(chuàng)建一個(gè) H5 容器,并自動(dòng) push 打開 * * @param params H5 容器的啟動(dòng)參數(shù),必填參數(shù):appId,其他可選參數(shù)參考文檔 https://tech.antfin.com/docs/2/85001 * */ - (void)startH5ViewControllerWithNebulaApp:(NSDictionary *)params; @end
利用全局資源包
Nebula 全局資源包解決多個(gè) H5 應(yīng)用使用同一資源產(chǎn)生的冗余問題,如 React 應(yīng)用使用 ReactJS 框架代碼。您可以將公共資源放入全局資源包,以降低 H5 應(yīng)用體積。您可以在 afterDidFinishLaunchingWithOptions
方法中配置全局離線包,如下文示例代碼,其中 77777777
為全局資源包的 appId。
nebulaCommonResourceAppList
用于告知 H5 容器指定 ID 的離線包將作為全局資源包使用。如果您沒有配置此 ID,即使內(nèi)置該離線包,也不會(huì)生效。
```
- (void)application:(UIApplication *)application afterDidFinishLaunchingWithOptions:(NSDictionary *)launchOptions
{
[MPNebulaAdapterInterface shareInstance].nebulaCommonResourceAppList = @[@"77777777"];// 設(shè)置全局資源包
}
```
通常情況下為了提高頁面的加載速度,建議預(yù)置全局資源包,后續(xù)依然可以通過 H5 應(yīng)用后臺(tái)下發(fā)更新。
動(dòng)態(tài)更新離線包
mPaaS 提供強(qiáng)大的動(dòng)態(tài)更新能力,您可以通過發(fā)布平臺(tái)下發(fā)一個(gè)新版本的離線包,來更新客戶端的對(duì)應(yīng)頁面。具體的操作步驟,請(qǐng)參見 實(shí)時(shí)發(fā)布 > 離線包管理 > 發(fā)布離線包。