[聚合文章] ios WebViewJavascriptBridge源码解析

这个库的还是比较精简单的，当前webView 是用UIWebView 那么我只需要引入WebViewJavascriptBridge ,相应的WKWebView则需要用到WKWebViewJavascriptBridge
这个桥接主要是介于js 和 app 间我们先来看js 要怎么做
我们需要copy 这段代码到js里至于为什么要这么做，后文会提到

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)}export default class IOSBridge {// key : xxx  参数 : json   回调: responseCallback      changeState (json) {          setupWebViewJavascriptBridge(function (bridge) {                 bridge.callHandler('xxx', json, function                responseCallback (responseData) {      })    })  }}

app 端只需要

_bridge = [WebViewJavascriptBridge bridgeForWebView:webView];[_bridge setWebViewDelegate:self];[self.bridge registerHandler:@"xxx" handler:^(id data, WVJBResponseCallback responseCallback) {    responseCallback(@"xxx");}];

简洁的代码就已经完成js与app的桥接，那么我们来看看他整个流程是怎么执行，
首先js 调用的代码出现一个了创建了一个iframe 并且设置src = 'https://bridge_loaded'
我们很清楚的知道如果WKWebView 可以捕获到url 的变化的 也就是说设置src后WKWebView 是有回调的，那么我把断点断到WKWebView的代理看看这里发生了什么(PS:为什么这里iframe 要appendChild到document, 然后又快速的remove 呢 ，我想到一个解释 ，是因为iframe 设置src 就无用了，iframe 只能通过 removeChild 才能移除掉，然后要想remove 就必须得先append )

原理简释：
当js 第一次app 桥接 我们在代理截获到 这段