mPaaS H5 容器知识清单 | FAQ · 第一期

时间 2019-11-06

标签 mpaas h5 容器知识清单 faq 一期繁體版

原文原文链接

mPaaS 离线包是什么？

Hybrid 开发模式已不是什么新鲜的话题，不只能够快速发布新业务，同时无需考虑 App 发版时间，为业务更新迭代提供了极强的灵活性。相比于 Web 开发，Hybrid 开发模式提供了丰富的设备 API，让业务形态能够更加多元和丰富。html

mPaaS 离线包源自于支付宝原生方案，经历了严苛的业务考验，让你直接和支付宝使用同一套框架层代码，拥有统一容器及内核，相对系统内核获取更低 Crash 率和 ANR 率，适配性强，并具有良好的、弹性的扩展能力，结合具体业务需求定制 JSAPI。git

它解决什么问题？

减小白屏
解决 Hybrid App 跨平台兼容与适配
提高 Hybrid App 性能
原生开发下的包大小优化

下面开始 mPaaS H5 容器知识清单 · FAQ 第一期

问题一、HTML5 容器加载时，若是加载错误仅回调 H5_PAGE_FINISHED，并无回调 H5_PAGE_ERROR。如何处理 H5_PAGE_ERROR，用原生的错误展现界面。github

答： H5_PAGE_ERROR 事件是容器内部事件，会被内部插件拦截，目前开发者没法直接使用。能够实现 H5ErrorPageView，在 errorPageCallback 启动原生页面。web

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。将刚才建立的错误页，设置给 APWebViewide

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());
复制代码

具体请参考：tech.antfin.com/docs/2/1269…优化

问题2：自定义 JSAPI 调取摄像头拍完照后，插件不能继承 H5Acitivity，没法写 onActivityResult 回调this

答：目前您可使用一个透明 activity 来启动相机，并接收返回参数，而后再经过广播（或其余手段通知您的 JSAPI）因为咱们在 H5Activity 中作了很多的工做，因此暂时不能开发继承 H5Activity，不过这是一个很是好的 issue，后续咱们看是否能够开发一些 H5Activity 的回调来解决这个问题。spa

问题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 源码地址：github.com/alipay/mpaa…
公测申请：mpaas2019.mikecrm.com/otOU1k1