码迷,mamicode.com
首页 > 编程语言 > 详细

通过WebViewJavascriptBridge实现OC与JS交互

时间:2015-07-16 16:10:31      阅读:119      评论:0      收藏:0      [点我收藏+]

标签:

这里照搬Github的Demo,其实还是很易懂的,首先,要在控制器的.h文件当中实现浏览器控件的协议:

1 #import 
2 
3 @interface ExampleAppViewController : UINavigationController 
4 
5 @end

 在.m方法当中,WebViewJavascriptBridge并没有直接复写代理方法,而是这样实现的:

 1 @interface ExampleAppViewController ()
 2 @property WebViewJavascriptBridge* bridge;
 3 @end
 4 
 5 @implementation ExampleAppViewController
 6 
 7 //在页面显示出来之前,注册bridge对象
 8 - (void)viewWillAppear:(BOOL)animated {
 9     if (_bridge) { return; }
10 
11     UIWebView* webView = [[UIWebView alloc] initWithFrame:CGRectMake(0, 0, 320, 400)];
12     [self.view addSubview:webView];
13 
14     //开启调试信息
15     [WebViewJavascriptBridge enableLogging];
16     
17     //响应JS通过send发送给OC的消息
18     _bridge = [WebViewJavascriptBridge bridgeForWebView:webView webViewDelegate:self handler:^(id data, WVJBResponseCallback responseCallback) {
19         NSLog(@"ObjC received message from JS: %@", data);
20         responseCallback(@"Response for message from ObjC");
21     }];
22     
23     //响应JS通过callhandler发送给OC的消息
24     [_bridge registerHandler:@"testObjcCallback" handler:^(id data, WVJBResponseCallback responseCallback) {
25         NSLog(@"testObjcCallback called: %@", data);
26         responseCallback(@"Response from testObjcCallback");
27     }];
28     
29     [self renderButtons:webView];
30     [self loadExamplePage:webView];
31 }

  

这个框架定义了两种OC和JS之间通信的方式,一种是send,发送一条消息,另一种是通过一个key调用callHandler,注意上方红色的方法,这两个方法接收js返回回来的data并显示,之后调用那个了responseCallback方法,给js回发一条消息,也就是回调。

OC可以相应JS发来的消息,也可以主动给JS发消息,Demo当中提取了两个方法:

 1 //OC调用send给JS发消息
 2 - (void)sendMessage:(id)sender {
 3     [_bridge send:@"A string sent from ObjC to JS" responseCallback:^(id response) {
 4         NSLog(@"sendMessage got response: %@", response);
 5     }];
 6 }
 7 
 8 //OC调用callHandler给JS发消息
 9 - (void)callHandler:(id)sender {
10     id data = @{ @"greetingFromObjC": @"Hi there, JS!" };
11     [_bridge callHandler:@"testJavascriptHandler" data:data responseCallback:^(id response) {
12         NSLog(@"testJavascriptHandler responded: %@", response);
13     }];
14 }

  

其中在JS端,可以有多个handler,所以callHandler需要一个key来寻找指定方法。responseCallback用于响应JS处理完毕后对OC的回调。

 

下面是JS端:


 JS的关键在于connectWebViewJavascriptBridge函数,log方法用于输出日志,是用户的自定义函数,所有的自定义函数都要写在connectWebViewJavascriptBridge当中作为成员。

bridge.init和bridge.registerHandler方法用于接收OC发来的send和callHandler,并对OC进行回调。

之后定义了两个按钮,通过上述两种方式直接调用OC,并处理OC回发的响应信息。

 

 

 

通过WebViewJavascriptBridge实现OC与JS交互

标签:

原文地址:http://www.cnblogs.com/douglasvegas/p/4651263.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!