iOS UIWebView和WKWebView的JS调用详解

        一般应用开发，用到webview和JS交互的地方特别多，当然也有很多优秀的第三方可以使用，例如：WebViewJavascriptBridge，有兴趣的可以研究下，非常好用的一个框架，本文主要概括下苹果提供的原声控件和JS互相简单调用。webview以及WKWebView。

     iOS8.0之前，苹果只提供UIwebview一个控件，这个控件JS调用OC主要通过UIwebview的代理方法：

- (BOOL)webView:(UIWebView *)webView shouldStartLoadWithRequest:(NSURLRequest *)request navigationType:(UIWebViewNavigationType)navigationTyp

在这个方法里面。可以拿到每一个URL，通过对URL的参数字段监测分析，可以实现JS调用OC代码。

OC调用JS主要通过UIwebview的一个方法：[webView stringByEvaluatingJavaScriptFromString:@"JS相关代码;"] 这样就能实现简单的OC调用JS。

       iOS8.0之后，苹果推出了WKWebView，webkit使用WKWebView来代替IOS的UIWebView和OSX的WebView，并且使用Nitro JavaScript引擎，这意味着所有第三方浏览器运行JavaScript将会跟safari一样快。在UIWebView，使用NSURLCache缓存，通过setSharedURLCache可以设置成我们自己的缓存，但WKWebView不支持NSURLCache ，虽然优点很多，但是调用JS的方法在这个控件里已经无法使用了，

        我们可以先创建一个WKWebView的配置项WKWebViewConfiguration，这可以设置偏好设置，与网页交互的配置，注入对象，注入js等：代码如下

//配置信息

WKWebViewConfiguration *config=[[WKWebViewConfiguration alloc]init];

config.preferences=[[WKPreferences alloc]init];

config.preferences.minimumFontSize = 10;

config.preferences.javaScriptEnabled = true;

// 默认是不能通过JS自动打开窗口的，必须通过用户交互才能打开

config.preferences.javaScriptCanOpenWindowsAutomatically =true;

// 通过js与webview内容交互配置

config.userContentController=[[WKUserContentController alloc]init];

// 添加一个名称，在JS通过这个名称发送消息

[config.userContentController addScriptMessageHandler:self name:@"yichu"];

WKWebView *webView = [[WKWebView alloc]initWithFrame:self.view.bounds configuration:config];

 接下来，我们看看WKScriptMessageHandler，这个是注入js名称，在js端通过window.webkit.messageHandlers.{InjectedName}.postMessage()方法来发送消息到native(你把对应的方法名称告诉给后台开发人员即可，)。我们需要遵守此协议，然后实现其代理方法，就可以收到消息，并做相应处理。这个协议只有一个方法：

- (void)userContentController:(WKUserContentController *)userContentController didReceiveScriptMessage:(WKScriptMessage *)message{

//此处可以得到之前配置项注入的名称，并且可以携带数据，json对象或者json字串等~

if ([message.name isEqualToString:@"yichu"]) {

NSDictionary *dict=message.body;

NSArray *Arr=dict[@"data"][@"data"];

NSNumber *index=dict[@"position"];

NSArray *array=[nxbGoodsModel objectArrayWithKeyValuesArray:Arr];

}

}

这个方法是相当好的API，我们给js注入一个名称，就会自动转换成js的对象，然后就可以发送消息到native端，这样就轻轻松松完成完成了JS调用native，推荐大家使用心得控件，这个控件相比于UIWebView, 其优势还是很明显的。