低成本的 H5 秒开方案-接口预请求

原文地址

低成本的 H5 秒开方案-接口预请求

https://juejin.cn/post/7376425155382231080

https://zhuanlan.zhihu.com/p/650304306

Hybrid App 离线包方案实践 · Issue #63 · mcuking/blog · GitHub

https://juejin.cn/post/7254549436625256506

如何同步请求结果并避免 H5 重复请求

最初我们想到的是通过 JSBridge 去轮循获取 APP 中请求的数据，但这种方式显然不够优雅。后来通过 APP 在获取到结果，并且 webview 触发“onLoad ”事件后，把数据注入到 window 对象下。

如图所示，正常情况下，存在两种情况：

1. H5 页面尚未加载好，数据就已返回

2. H5 页面加载完成后，数据尚未返回

不管是哪种情况，我们都可以通过监听 注入的 window 对象，来获取数据，当第一次没有读取到时，会立即发起 H5 本身的请求，这样即使接口预请求异常也不影响 H5 本身。
对于 window 对象我们通过 Object.defineProperty 进行监听，APP 和 H5 自身的请求谁先返回就用谁。

离线包  看这个 

GitHub - mcuking/mobile-web-best-practice: :tiger: 移动 web 最佳实践