JSBridge 跟WKWeview 或者UIWebview的交

这个目前网络上很多，主要是为了说明Android和IOS如何处理的问题。
Android请跳转https://www.jianshu.com/p/0a4a6c4efef8

引用Pod第三方库

  pod 'WebViewJavascriptBridge', '6.0.3'

通过看源码有这些函数

@interface WKWebViewJavascriptBridge : NSObject<WKNavigationDelegate, WebViewJavascriptBridgeBaseDelegate>

+ (instancetype)bridgeForWebView:(WKWebView*)webView;
+ (void)enableLogging;
// 注册
- (void)registerHandler:(NSString*)handlerName handler:(WVJBHandler)handler;
- (void)removeHandler:(NSString*)handlerName;
// 回调js
- (void)callHandler:(NSString*)handlerName;
- (void)callHandler:(NSString*)handlerName data:(id)data;
- (void)callHandler:(NSString*)handlerName data:(id)data responseCallback:(WVJBResponseCallback)responseCallback;
- (void)reset;
- (void)setWebViewDelegate:(id)webViewDelegate;
- (void)disableJavscriptAlertBoxSafetyTimeout;

@end

js调用IOS，IOS需要监听js事件，在ios使用

 jsBridge = WKWebViewJavascriptBridge.init(for: webview)
            jsBridge?.setWebViewDelegate(self)
     jsBridge?.registerHandler("jseventName", handler: { (data, callback) in
            // todo something
            // callback js
            callback()
            })
// H5代码发送如下
     bridge.callHandler('jseventName', '参数，一般是字符串', function(response) {
                        
                          })

其中callback是回调给js的，如果不需要回调，这个方法可以不用调用。
比如

  [self.bridge callHandler:@"registerIOSEvent" data:@{@"name": @"标哥"} responseCallback:^(id responseData) {
    NSLog(@"from js: %@", responseData);
  }];
//记得这边的参数只有两个，data是任意对象，H5中的注册看下面

ios调用js可以使用callHandler，这个需要在js中注册ios中的事件，，需要在H5中定义

  /*这段代码是固定的，必须要放到js中*/
      function setupWebViewJavascriptBridge(callback) {
          if (window.WebViewJavascriptBridge) { return callback(window.WebViewJavascriptBridge); }
        if (window.WVJBCallbacks) { return window.WVJBCallbacks.push(callback); }
        window.WVJBCallbacks = [callback];
        var WVJBIframe = document.createElement('iframe');
        WVJBIframe.style.display = 'none';
        WVJBIframe.src = 'wvjbscheme://__BRIDGE_LOADED__';
        document.documentElement.appendChild(WVJBIframe);
        setTimeout(function() { document.documentElement.removeChild(WVJBIframe) }, 0)
      }
    
      /*与OC交互的所有JS方法都要放在此处注册，才能调用通过JS调用OC或者让OC调用这里的JS*/
      setupWebViewJavascriptBridge(function(bridge) {
       var uniqueId = 1
       function log(message, data) {
         var log = document.getElementById('log')
         var el = document.createElement('div')
         el.className = 'logLine'
         el.innerHTML = uniqueId++ + '. ' + message + ':<br/>' + JSON.stringify(data)
         if (log.children.length) {
            log.insertBefore(el, log.children[0])
         } else {
           log.appendChild(el)
         }
       }
       /* Initialize your app here */
//h5注册事件
     bridge.registerHandler('registerIOSEvent', function(data, responseCallback) {
         responseCallback("回调参数，可以是字典，数组，字符串")
       })

由于ios中对参数有要求，所以H5的页面写入需要严格控制参数规范，然后Android是可以定制的，所以两端调试的时候需要记得H5的参数控制，包括函数注册和接受的参数问题，都要小心对待。

另外，webview中调用js也可以直接使用webview中的evaluateJavaScript函数直接调用，根据业务需求选择合适的方式
如果有什么问题，请下方留言