JSBridge 是一种 webview 侧和 native 侧进行通信的手段
source:https://zhuanlan.zhihu.com/p/381459761
1. 实现原理
app的native端拦截webview 的url请求来互相通信
2. 实现步骤
2.1 js端
setupWebViewJavascriptBridge方法的作用,将回调callback放入window.WVJBCalls数组中,没有则创建之。
```function setupWebViewJavascriptBridge(callback) {
if (window.WebViewJavascriptBridge) { return callback(WebViewJavascriptBridge); }
if (window.WVJBCallbacks) { return window.WVJBCallbacks.push(callback); }
window.WVJBCallbacks = [callback];
var WVJBIframe = document.createElement('iframe');
WVJBIframe.style.display = 'none';
WVJBIframe.src = 'https://__bridge_loaded__';
document.documentElement.appendChild(WVJBIframe);
setTimeout(function() { document.documentElement.removeChild(WVJBIframe) }, 0)
}```
2.2 app端
(1)拦截了所有的 URL 请求并拿到 url
(2)^^^
(3)继续判断,如果是isBridgeLoadedURL,那么会执行injectJavascriptFile方法,会向 webview 中再次注入一些逻辑,其中最重要的逻辑就是,在 window 对象上挂载一些全局变量和WebViewJavascriptBridge属性
(4)继续判断,如果是 isQueueMessageURL,那么这就是个处理消息的回调,需要执行一些消息处理的方法