Objective-跟JavaScript互相调用那点事

2017-09-06  本文已影响38人  Freedom_Coco

动态的通过webView加载html文件,这样就可以实时更新Html的内容,给用户更好的体验效果。iOS早期的中,主要是通过UIWebView来实现这个功能,好,告诉你,iOS8以后,有了一个WKWebView,用它,用它,用它。性能、内存绝对是一个很大的优化的体验。本文,从两个角度讲述,WKWebView的使用。##使用原声代码实现WKWebView使用稍等、待续##使用绝壁的第三方来实现WKWebView使用WebViewJavascriptBridge的作者也做了一套支持WKWebView与JS交互的第三方框架:。(WKWebViewJavascriptBridge)>cocoaPods: pod ‘WebViewJavascriptBridge’, ‘~> 5.0.5’>github地址:https://github.com/marcuswestin/WebViewJavascriptBridge安装上,我们开始玩耍!注意:先将我们提前写好的HTML放到服务上,为了模拟的更逼真点,这里采用XAMPP开了服务,放进去HTML代码

Paste_Image.png 使用:###注意事项 1、http要适配修改info文件NSAppTransportSecurityNSAllowsArbitraryLoads2、要引入#import// 使用WKwebview要导入此文件3、WKWebViewJavascriptBridge包含了UIWebView跟WKWebView。因此要注意导入的头文件JS调用Objective1、data js传递给原生的参数2、responseCallback 原生回调js的方法 [_bridge registerHandler:@"Login" handler:^(id data, WVJBResponseCallback responseCallback) { NSLog(@"JS called Objective,objectie get js param: %@", data); // 写登录逻辑判断 NSDictionary * returnData = @{@"data":@"登录成功"}; responseCallback(returnData); }];###完整的Objective代码```#import "ViewController.h"#import// 使用WKwebview要导入此文件#import@interface ViewController ()@property (weak, nonatomic) IBOutlet UILabel *lblLog;

@property (weak, nonatomic) IBOutlet UIButton *buttonCallBack;

@property WKWebViewJavascriptBridge* bridge;

@end

@implementation ViewController

id data = @{@"data": @"oc调js啦"};

[self.bridge callHandler:@"callJS" data:data responseCallback:^(id response) {

NSLog(@"js返回了: %@", response);

}];

}

[super viewDidLoad];

WKWebView *webView = [[WKWebView alloc] initWithFrame:self.view.frame];

webView.backgroundColor = [UIColor clearColor];

webView.userInteractionEnabled = YES;

webView.navigationDelegate = self;

[WKWebViewJavascriptBridge enableLogging];// 开启日志

_bridge = [WKWebViewJavascriptBridge bridgeForWebView:webView];

[_bridge setWebViewDelegate:self];

[_bridge registerHandler:@"getJson" handler:^(id data, WVJBResponseCallback responseCallback) {

NSLog(@"JS called Objective,objectie get js param: %@", data);

NSDictionary * returnData = @{@"data":@"objective return js param is hello world"};

responseCallback(returnData);

}];

[_bridge registerHandler:@"Login" handler:^(id data, WVJBResponseCallback responseCallback) {

NSLog(@"JS called Objective,objectie get js param: %@", data);

// 写登录逻辑判断

NSDictionary * returnData = @{@"data":@"登录成功"};

responseCallback(returnData);

}];

[webView loadRequest:[NSURLRequest requestWithURL:[NSURL URLWithString:@"http://192.168.1.221/web/IOSTest/test.html"]]];// 注意html文件的路径

[self.view addSubview:webView];

[self.view bringSubviewToFront:self.lblLog];

[self.view bringSubviewToFront:self.buttonCallBack];

}

@end


Objective调用JS

1、参数1.调用js给我准备好的方法

2、参数2,原生传递给js的参数

3、参数3、js回调给原生的方法

id data = @{@"data": @"oc调js啦"};

[self.bridge callHandler:@"callJS" data:data responseCallback:^(id response) {

NSLog(@"js返回了: %@", response);

}];


##HTML代码

算了,html代码比较多,还是上传到git上面去。

##代码在这里!这里!这里!

[代码](https://git.oschina.net/freedom_coco/ObjectiveCallJs.git)

https://git.oschina.net/freedom_coco/ObjectiveCallJs.git

##注意事项

1、如果Xcode控制台有打印,而页面没有反应,那么就是页面这边报错了。通过浏览器访问下,就可以定位到问题

2、如果点击都xcode日志也没有打印,页面也没有变化,那么一般都是bridge没有成功,失败了。原生出问题了。
上一篇下一篇

猜你喜欢

热点阅读