社区微信群开通啦,扫一扫抢先加入社区官方微信群
社区微信群
JSBridge:听其取名就是js和Native之前的桥梁,而实际上JSBridge确实是JS和Native之前的一种通信方式。简单的说,JSBridge就是定义Native和JS的通信,Native只通过一个固定的桥对象调用JS,JS也只通过固定的桥对象调用Native。JSBridge另一个叫法及大家熟知的Hybrid app技术。
流程:H5->通过某种方式触发一个url->Native捕获到url,进行分析->原生做处理->Native调用H5的JSBridge对象传递回调。
我们前面讲过了原生的WebView/UIWebView控件已经能够和Js实现数据通信了,那为什么还要JSBridge呢?
其实使用JSBridge有很多方面的考虑:
url scheme是一种类似于url的链接,是为了方便app直接互相调用设计的。具体来讲如果是系统的url scheme,则打开系统应用,否则找看是否有app注册这种scheme,打开对应app。
注:这种scheme必须原生app注册后才会生效。
而在我们实际的开发中,app不会注册对应的scheme,而是由前端页面通过某种方式触发scheme(如用iframe.src),然后Native用某种方法捕获对应的url触发事件,然后拿到当前的触发url,根据定义好的协议,分析当前触发了那种方法。
要实现JSBridge,我们需要按以下步骤分析:
JSBridge的完整流程可总结为:
我们规定,JS和Native之间的通信必须通过一个H5全局对象JSbridge来实现。该对象有如下特点:
该对象名为”JSBridge”,是H5页面中全局对象window的一个属性,形如:
var JSBridge = window.JSBridge || (window.JSBridge = {});
该对象有如下方法:
转载: JSBridge深度剖析
如果觉得我的文章对您有用,请随意打赏。你的支持将鼓励我继续创作!