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