OC与JS交互方式

1.通过拦截URL（适用于UIWebView和WKWebView）

- (BOOL)webView:(UIWebView *)webView shouldStartLoadWithRequest:(NSURLRequest *)request navigationType:(UIWebViewNavigationType)navigationType {
NSString *url = request.URL.absoluteString;
if ([url rangeOfString:@"需要跳转源生界面的URL判断"].location != NSNotFound) {
//跳转原生界面
return NO;
}
return YES;
}

2.JS调用OC代码(messageHander)

• window.webkit.messageHandlers.<方法名>.postMessage(<数据>)

//JS执行window.webkit.messageHandlers.Share.postMessage()
function shareClick() {
window.webkit.messageHandlers.Share.postMessage({title:'测试分享的标题',content:'测试分享的内容',url:'https:baidu.com'});
}

• 那么在OC中的处理方法如下.它是WKScriptMessageHandler的代理方法.name和上方JS中的方法名相对应

[userContentController addScriptMessageHandler:self name:@"Share"];

- (void)userContentController:(WKUserContentController *)userContentController didReceiveScriptMessage:(WKScriptMessage *)message
{
//JS调用OC方法
//message.boby就是JS里传过来的参数
NSLog(@"body:%@",message.body);
if ([message.name isEqualToString:@"Share"]) {
[self ShareWithInformation:message.body];
}
}

3.JavascriptCore (UIWebView)

function 1
function 2

-(void)webViewDidFinishLoad:(UIWebView *)webView
{
self.jsCOntext= [self.webView valueForKeyPath:@"documentView.webView.mainFrame.JavascriptContext"];
// 方法一
__weak typeof(self) weakSelf = self;
self.jsContext[@"getMessage"] = ^(){
return [weakSelf blockCallMessage];
};
// 方法二
self.jsContext[@"JavascriptInterface"] = self;

//OC调用js
NSString *runJS = @"执行的JS代码";
//准备执行的JS代码
[self.jsContext evaluateScript:runJS];
}

4.使用三方库WebViewJavascriptBridge,可提供 js 调OC,以及OC调JS

1. 设置 webViewBridge
_bridge = [WKWebViewJavascriptBridge bridgeForWebView:self.webView];
[_bridge setWebViewDelegate:self];
2. 注册handler方法,需要和 前段协商好 方法名字,是供 JS调用Native 使用的。
[_bridge registerHandler:@"scanClick" handler:^(id data, WVJBResponseCallback responseCallback) {
// OC调用
NSString *scanResult = @"http://www.baidu.com";
// js 回调传参
responseCallback(scanResult);
}];
3. OC掉用JS
[_bridge callHandler:@"testJSFunction" data:@"一个字符串" responseCallback:^(id responseData) {
NSLog(@"调用完JS后的回调：%@",responseData);
}];