WebViewJavascriptBridge

1、选择

项目自己webview使用的是WKWebview，其实WKWebview自带的messageHandle也能够知足此需求
JSContext,源自于JavaScriptCore框架中的东西，最后不使用此方案源于一下几点
- 可是其中繁杂的字符串使用，让我觉的可能会因为粗心出现不可预知的错误
- 加载时机的问题，当你从新loadrequest的时候，会致使js注入失败
- 回调方法略复杂
JavaScriptBridge，最后选择此库源于如下几点
- 使用简单，注册完毕以后设置完代理，只须要负责注册方法和调用方法
- 回调简单，两端回调responsecallback包含在注册的方法中。使用block
- 三端通用，JavaScript和iOS、Android均可以（Android版本库）
- Ps :关于Android版本库，其中不少是按照iOS版的JavaScriptBridge改写的。可是其中有不少问题，尤为是各类调用时机问题，上面的连接是通过我旁边的Android小哥试了四五个版本以后发现的，修复了各类改写版的问题

2、使用

首先须要引入WebViewJavascriptBridge库

#import "WebViewJavascriptBridge.h"

初始化，此处为了方便子类使用，因此在基类中注册bridge，并return bridge对象，方便子类调用

#pragma mark - 桥接 - (void)InitializeWebViewJavascriptBridge { // 注册桥接 self.bridge = [SWHybridManager setJavaScriptBridgeWithWebView:self.webView controller:self]; } [WKWebViewJavascriptBridge enableLogging]; WKWebViewJavascriptBridge *bridge = [WKWebViewJavascriptBridge bridgeForWebView:webView]; [bridge setWebViewDelegate:controller];

注册方法供JavaScript调用

__weak typeof(controller)wController = controller; /****************************公共方法注册-Start*********************/ //MARK:打开窗体 [bridge registerHandler:HandlerFunctionNameOpenWindow handler:^(id data, WVJBResponseCallback responseCallback) { __strong typeof(wController)sController = wController; NSLog(@"\n调用了openWindow: %@", data); NSDictionary *dict = (NSDictionary *)data; SWOpenWindowModel *model = [SWOpenWindowModel yy_modelWithDictionary:dict]; [self pushViewController:sController data:model responseCallback:responseCallback]; }];

调用JavaScript方法

[self.bridge callHandler:callFunctionNameGetSearchKeyWord data:json];

3、方法名定义

由于方法名的定义是字符串，因此建议采用常量字符串，防止拼写错误
其次不建议采用宏定义
我采用如下方法
桥接管理类的.h

/**打开窗体 */ FOUNDATION_EXPORT NSString *const HandlerFunctionNameOpenWindow; /** 关闭窗口*/ FOUNDATION_EXPORT NSString *const HandlerFunctionNameCloseWindow;

桥接管理类的.m

/**打开窗体 */ NSString *const HandlerFunctionNameOpenWindow = @"openWindow"; /** 关闭窗口*/ NSString *const HandlerFunctionNameCloseWindow = @"closeWindow";

使用时直接使用常量字符串便可
注意点：如相似我使用在基类传入控制器和webview到管理类中，在类中使用controller要注意循环引用，不然会致使控制器没法释放

+ (WKWebViewJavascriptBridge *)setJavaScriptBridgeWithWebView:(WKWebView *)webView controller:(__kindof SWBaseWebViewController *)controller; __weak typeof(controller)wController = controller; // 弱引用传入控制器 __strong typeof(wController)sController = wController; // 在block内部强引用

4、数据传输

iOS端直接返回字典便可
我代码中是返回json字符串，为了与Android统一，方便H5解析数据

5、JavaScript代码

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) }

setupWebViewJavascriptBridge(function(bridge) { /* Initialize your app here */ bridge.registerHandler('JS Echo', function(data, responseCallback) { console.log("JS Echo called with:", data) responseCallback(data) }) bridge.callHandler('ObjC Echo', {'key':'value'}, function responseCallback(responseData) { console.log("JS received response:", responseData) }) })

6、注意事项

若是产生调用不通的问题，多为JavaScript调用时机问题
注意桥接的代理