
mPaaS 離線包是什麼?
Hybrid 開發模式已不是什麼新鮮的話題,不僅可以快速釋出新業務,同時無需考慮 App 發版時間,為業務更新疊代提供了極強的靈活性。相比于 Web 開發,Hybrid 開發模式提供了豐富的裝置 API,讓業務形态可以更加多元和豐富。
mPaaS 離線包源自于支付寶原生方案,經曆了嚴苛的業務考驗,讓你直接和支付寶使用同一套架構層代碼,擁有統一容器及核心,相對系統核心擷取更低 Crash 率和 ANR 率,适配性強,并具備良好的、彈性的擴充能力,結合具體業務需求定制 JSAPI。
它解決什麼問題?
- 減少白屏
- 解決 Hybrid App 跨平台相容與适配
- 提升 Hybrid App 性能
- 原生開發下的包大小優化
下面開始 mPaaS H5 容器知識清單 · FAQ 第一期
問題1、HTML5 容器加載時,如果加載錯誤僅回調 H5_PAGE_FINISHED,并沒有回調 H5_PAGE_ERROR。如何處理 H5_PAGE_ERROR,用原生的錯誤展示界面。
答:
H5_PAGE_ERROR 事件是容器内部事件,會被内部插件攔截,目前開發者無法直接使用。
可以實作 H5ErrorPageView,在 errorPageCallback 啟動原生頁面。
Step1: 建立一個 HTML 格式的自定義錯誤頁
<!doctype html>
<html lang="zh-cn">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width,maximum-scale=1.0,minimum-scale=1.0,user-scalable=no" />
<meta name="format-detection" content="telephone=no" />
<title>自定義錯誤</title>
</head>
<body>
<p>這個頁面是一個自定義錯誤頁</p>
</body>
</html>
Step2: 實作 H5ErrorPageView。将剛才建立的錯誤頁,設定給
APWebView
public class H5ErrorPageViewImpl implements H5ErrorPageView {
@Override
public boolean enableShowErrorPage() {
// true 表示啟動自定義錯誤頁
return true;
}
@Override
public void errorPageCallback(H5Page h5Page, APWebView view, String errorUrl, int statusCode, String errorMsg, String subErrorMsg) {
// 擷取錯誤頁的 html,demo 中放到了 raw 中,也可以放在其他地方
String html = H5ResourceManager.readRawFromResource(R.raw.custom_error, LauncherApplicationAgent.getInstance().getApplicationContext().getResources());
// 将錯誤頁設定給 webview
view.loadDataWithBaseURL(errorUrl, html, "text/html", "utf-8", errorUrl);
}
}
Step3: 注冊 H5ErrorPageView。在打開 H5 容器之前,将自定義的 H5ErrorPageView 注冊給容器。
H5Utils.setProvider(H5ErrorPageView.class.getName(),new H5ErrorPageViewImpl());
具體請參考:
https://tech.antfin.com/docs/2/126953#h2--h5-2問題2:自定義 JSAPI 調取攝像頭拍完照後,插件不能繼承 H5Acitivity,無法寫 onActivityResult 回調
目前您可以使用一個透明 activity 來啟動相機,并接收傳回參數,然後再通過廣播(或其他手段通知您的 JSAPI)
由于我們在 H5Activity 中做了不少的工作,是以暫時不能開發繼承 H5Activity,不過這是一個非常好的 issue,後續我們看是否可以開發一些 H5Activity 的回調來解決這個問題。
問題3:Android 如何不預置 H5 的情況下,直接下載下傳離線包?
答:上傳離線包到 mPaaS MDS 釋出服務,使用 MPNebula.startApp 方法即可。
補充:目前 H5 容器沒有使用 MPnebula.startApp(),而是直接用的内嵌形式的。如何解決?
h5Page = h5Service.createPage(this, bundle);
h5Page.getPluginManager().register(new NativeLoadingPlugin());
FrameLayout.LayoutParams lp = new FrameLayout.LayoutParams(
AUFrameLayout.LayoutParams.MATCH_PARENT, AUFrameLayout.LayoutParams.WRAP_CONTENT);
mContainer.addView(h5Page.getContentView(), lp);
答:MPNebula.updateAll
目前 mPaaS H5 容器 Demo 源碼已釋出,歡迎 Star 我們進而進一步了解特性和亮點。
- Demo 源碼位址: https://github.com/alipay/mpaas-demo
- 公測申請: https://ur.alipay.com/48TghM