每日一文

混合开发Hybrid,JSBridge原理简述

2021-03-08  本文已影响0人  永恒即是最美

混合开发(Hybrid),是一种开发模式,指使用多种开发模型开发App。一般有两大模式:原生Native、Web H5。混合开发时,原生、Web相互通信都离不开JSBridge。

JSBridge:以JavaScript引擎或Webview容器作为媒介,通过协定协议进行通信,实现Native端和Web端双向通信的一种机制。(webView是移动端提供的运行JavaScript的环境,是系统渲染Web网页的一个控件)

Native原生接口,封装成JavaScript接口(Native→web):

将拼接的JavaScript代码字符串,传入JS解析器执行,JS解析器在这里就是webView。

Web端JavaScript接口,封装成Native原生接口(web→Native):

1.拦截Webview请求的URL Schema

URL Schema是类URL的一种请求格式:<protocol>://<host>/<path>?<qeury>#fragment
自定义JSBridge通信的URL Schema,比如:jsbridge://showToast?text=hello

Native加载WebView之后,Web发送的所有请求都会经过WebView组件,所以Native可以重写WebView里的方法,从来拦截Web发起的请求,我们对请求的格式进行判断:

2.向Webview中注入JS API(目前更好的选择):

通过webView提供的接口,App将Native的相关接口注入到JS的Context(window)的对象中,一般来说这个对象内的方法名与Native相关方法名是相同的,Web端就可以直接在全局window下使用这个暴露的全局JS对象,进而调用原生端的方法。

完整的调用是双向通信,需要一个回调函数,技术实现上就是使用了两次单向通信。常用开源的JSBridge:DSBridge、jsBridge。

(暂时没搞过混合开发,权当了解,面试有得聊)

上一篇 下一篇

猜你喜欢

热点阅读