iOS中原生APP与JS交互 之 WebViewJavascriptBridge 的简单用法

有时候我们需要跟H5界面做一些简单的交互功能，这就需要跟JS打交道了。

1、首先初始化一个webview（viewdidload）

UIWebView* webView = [[UIWebView alloc] initWithFrame:self.view.bounds];
[self.view addSubview:webView];

2、关联webview与WebViewJavascriptBridge

[WebViewJavascriptBridge enableLogging];
  
  _bridge = [WebViewJavascriptBridge bridgeForWebView:webView webViewDelegate:self handler:^(id data, WVJBResponseCallback responseCallback) {
    NSLog(@"ObjC received message from JS: %@", data);
    
    responseCallback(@"Response for message from ObjC");
  }];

3、下面就是原生APP与JS 的交互了

3.1、js调oc方法

/**
     *   js调oc方法（可以通过data给oc方法传值，使用responseCallback将值再返回给js）
     *
     *  @param data             从H5传值给原生OC
     *  @param responseCallback 使用responseCallback将值再返回给js
     *
     *  @return
     */

[_bridge registerHandler:@"testObjcCallback" handler:^(id data, WVJBResponseCallback responseCallback) {
        NSLog(@"testObjcCallback called: %@", data);
        responseCallback(@"Response from testObjcCallback");
    }];

这里注意testObjcCallback这个方法的标示（切记这个是个Key不是方法名（自己纠结半天没数据））。html那边的命名要跟ios这边相同，才能调到这个方法。当然这个名字可以两边商量着自定义。简单明确即可。

3.2、oc调js方法（通过data可以传值，通过 response可以接受js那边的返回值）

/**
         *  oc调js方法（通过data可以传值，通过 response可以接受js那边的返回值 ）
         *
         *  @param data     OC原生传给JS值
         *  @param response js返回的数据
         *
         *  @return
         */

id data = @{ @"greetingFromObjC": @"Hi there, JS!" };
    [_bridge callHandler:@"testJavascriptHandler" data:data responseCallback:^(id response) {
        NSLog(@"testJavascriptHandler responded: %@", response);
    }];

 注意这里的 testJavascriptHandler也是个方法标示。

3.3、oc给js传值（通过 response接受返回值 ）

[_bridge send:@"A string sent from ObjC to JS" responseCallback:^(id response) {
        NSLog(@"sendMessage got response: %@", response);
    }];

3.4、oc给js传值（无返回值）

[_bridge send:@"A string sent from ObjC after Webview has loaded."];