在我们实际的开发过程中，经常会遇到JS与OC相互调用的过程，现将一些常用的方法整理出来。
1.UIWebView 代理方法拦截URL。
2.WKWebView 代理方法拦截URL。
3.利用系统库JavaScriptCore。
1.UIWebView 代理方法拦截URL
JS调用OC
js部分相关代码
<div>
<button class=\"btn\" type=\"button\" onclick=\"btnClick2()\">
JS调用OC方法 一个参数
</button>
</div>
function btnClick2() { location.href = \"testhtml://method2?iPhone7Plus\"}
testhtml是你和h5约定好的，通过在UIWebView的代理方法，实现调用OC的方法。
oc相关代码
- (BOOL)webView:(UIWebView *)webView shouldStartLoadWithRequest:(NSURLRequest *)request navigationType:(UIWebViewNavigationType)navigationType{
void (^AlertViewBlock)(NSString * title,NSString * message,NSString * cancel) = ^(NSString * title,NSString * message,NSString * cancel){
UIAlertView * alertView = [[UIAlertView alloc] initWithTitle:title message:message delegate:self cancelButtonTitle:cancel otherButtonTitles:nil];
[alertView show];
};
NSString * urlString = request.URL.absoluteString;
NSString * scheme = @"testhtml://";
if ([urlString hasPrefix:scheme]) {
//
NSString * subString = [urlString substringFromIndex:scheme.length];
NSArray * temp = [subString componentsSeparatedByString:@"?"];
NSString * method = [temp firstObject];
if ([method isEqualToString:@"method1"]) {
AlertViewBlock(@"JS调用OC方法",@"无参",@"取消");
}else if ([method isEqualToString:@"method2"]) {
NSString * param = [temp lastObject];
AlertViewBlock(@"JS调用OC方法",[NSString stringWithFormat:@"一个参数\n参数为:%@",param],@"取消");
}else if ([method isEqualToString:@"method3"]) {
NSString * string = [temp lastObject];
NSRange range = [string rangeOfString:@"&"];
NSString * param1 = [string substringToIndex:range.location];
NSString * param2 = [string substringFromIndex:range.location + 1];
AlertViewBlock(@"JS调用OC方法",[NSString stringWithFormat:@"两个参数\n参数为:%@,%@",param1,param2],@"取消");
}
}
return YES;
}
OC调用JS
js相关代码
function alertName(msg) { alert('OC调用JS 一个参数 ' + msg )}
oc相关代码
在oc中创建一个按钮，点击按钮，调用js中的alertName方法
- (IBAction)buttonClick:(UIButton *)button{
NSLog(@"OC调用JS 一个参数");
// 如果js的方法中需要传入多个参数，可以通过字符串拼接的方式实现
NSString * testJS = [NSString stringWithFormat:@"alertName('%d')",10];
[self.webView stringByEvaluatingJavaScriptFromString:testJS];
}
2.WKWebView拦截URL实现
WKWebView是Apple在iOS8推出的Webkit框架中的负责网页的渲染与展示的类，区别如下:
- UIWebView会导致内存问题，WKWebView相比UIWebView速度更快，占用内存更少，支持更多的HTML特性。
- 同时WKWebView可以很容易地实现H5页面加载进度。
- WKWebView不能弹出前端的alert，需在代理方法中弹出原生alertController。
JS调用OC
实现WKNavigationDelegate的代理方法，在方法中通过判断与h5定义好的方法名称，去调用对应的OC方法
- (void)webView:(WKWebView *)webView decidePolicyForNavigationAction:(WKNavigationAction *)navigationAction decisionHandler:(void (^)(WKNavigationActionPolicy))decisionHandler{
NSString * absoluteString = [navigationAction.request.URL.absoluteString stringByRemovingPercentEncoding];
NSString * scheme = @"testhtml://";
// JS调用OC
if ([absoluteString hasPrefix:scheme]) {
[self jsCallOCMethodWithRequest:navigationAction.request];
decisionHandler(WKNavigationActionPolicyCancel);
}else {
decisionHandler(WKNavigationActionPolicyAllow);
}
}
OC调用JS
点击OC中的button按钮，去调用JS中的方法，在button的方法中加入以下代码:
NSString * testJS = [NSString stringWithFormat:@"ocCallJs('%d')",arc4random_uniform(100)];
[self.wkWebView evaluateJavaScript:testJS completionHandler:^(id _Nullable response, NSError * _Nullable error) {}];
3.JavaScriptCore
1.导入<JavaScriptCore/JavaScriptCore.h>
2.遵循<UIWebViewDelegate>并实现- (void)webViewDidFinishLoad:(UIWebView *)webView方法。
与前两个拦截URL明显不同的是，JS可以直接调用原生的方法了。
JS调用OC
js代码
<div><button class=\"btn\" type=\"button\" onclick=\"btnClick4()\">JS调用OC方法(JavaScriptCore)</button></div>
function btnClick4() { ocClick('10');}\
oc代码
在UIWebView的- (void)webViewDidFinishLoad:(UIWebView *)webView代理方法中
JSContext * context = [webView valueForKeyPath:@"documentView.webView.mainFrame.javaScriptContext"];
//! 监听JS代码里面的jsToOc方法（执行效果上可以理解成重写了JS的jsToOc方法）
context[@"ocClick"] = ^(NSString * str1, NSString * str2) {
dispatch_async(dispatch_get_main_queue(), ^{
NSLog(@"str1 %@ , --- str2 %@ ,",str1,str2);
// 要执行的oc代码
});
};
OC调用JS
js代码
function ocCallJs(action, params) { document.getElementById(\"returnValue\").innerHTML = action + '?' + params;}
oc代码
// 写法1.
// [context[@"ocCallJs"] callWithArguments:@[@"111",@"222"]];
// 写法2.
NSString *jsStr = [NSString stringWithFormat:@"ocCallJs('%d','%d')",15,20];
[context evaluateScript:jsStr];
注意点：JavaScriptCore可以通过JS直接调用原生函数，所以相对于拦截URL响应，JS与原生的数据传递更方便。
因为WKWebView不能通过KVC获取JSContext对象，所以原生使用JavaScriptCore做数据交互的时候，就不能用WKWebView去加载H5页面。
