1. URL拦截
WebView 与 WKWebView 都可使用。
1.1 JS调用oc
- 首先跟后端协定好协议，如：iosprotocolname://back 表示点击返回按钮
- 在 shouldStartLoadWithRequest 方法中处理
- 当拦截到后，处理自己事务，并return NO
1.2 OC调用 JS
- 在网页加载完成后。webViewDidFinishLoad
- 使用方法 ： stringByEvaluatingJavaScriptFromString进行调用
关键代码
- (BOOL)webView:(UIWebView *)webView shouldStartLoadWithRequest:(NSURLRequest *)request navigationType:(UIWebViewNavigationType)navigationType{
// jS 调用 OC
NSString *reqStr = request.URL.absoluteString;
NSLog(@"request:%@",reqStr);
if ([reqStr isEqualToString:@"protocolname://back"]) {
[self back];
return NO;
}else if ([reqStr hasPrefix:@"protocolname://"]) {
//在这里做JavaScript调用Objective-C的事。
//需要传的值放在url后面的参数里如：ProtocolName://www.xxxxcom?{"title":"标题","id":"123","des":"描述内容"}
//1. 对制定的协议进行数据解析。里面可能包含调用地址，参数等等。
//2. 处理自身事务(可能用到解析到的数据，比如参数)
//3. 可能需要回调，将数据回传给JS
[webView stringByEvaluatingJavaScriptFromString:@"alert('seccess')"];
return NO;
}
return YES;
}
2. MessageHandler
WKWebView 初始化时，有一个参数叫configuration，它是WKWebViewConfiguration类型的参数，
而WKWebViewConfiguration有一个属性叫userContentController，它又是WKUserContentController类型的参数。
WKUserContentController对象有一个方法- addScriptMessageHandler:name:，我把这个功能简称为MessageHandler
流程
初始化 WKWebView ，需配置 configuration(
WKWebViewConfiguration)初始化WKWebViewConfiguration ，配置userContentController(
WKUserContentController)-
初始化WKUserContentController，并通过
- addScriptMessageHandler:name:，注册js中的方法， 并设置处理接收JS方法的对象handel: id
代理对象
name: js中的方法名称 -
在代理回调中进行事件捕获处理
- (void)userContentController:(WKUserContentController *)userContentController didReceiveScriptMessage:(WKScriptMessage *)message{ //WKScriptMessage message //message中包含有name： 方法名， body：参数等信息 }
注意点
WKWebView 在 addScriptMessageHandler 时，应注意循环引用的问题。例如：直接在控制器中添加： [userController addScriptMessageHandler:self name:@"jsToOcNoPrams"];
循环原因：
控制器 --->
WKWebView(configuration) -->WKWebViewConfiguration(userContentController)-->WKUserContentController(addScriptMessageHandler:设置为self) --> 控制器
解决办法：
- 在viewWillDisappear中 移除之前添加的MessageHandle
- 声明一个中间变量，设置其代理 为 weak 弱引用。
弱引用示例：
// WKWebView 内存不释放的问题解决
@interface WeakWebViewScriptMessageDelegate : NSObject
//WKScriptMessageHandler 这个协议类专门用来处理JavaScript调用原生OC的方法
@property (nonatomic, weak) id scriptDelegate;
- (instancetype)initWithDelegate:(id)scriptDelegate;
@end
@implementation WeakWebViewScriptMessageDelegate
- (instancetype)initWithDelegate:(id)scriptDelegate {
self = [super init];
if (self) {
_scriptDelegate = scriptDelegate;
}
return self;
}
//遵循WKScriptMessageHandler协议，必须实现如下方法，然后把方法向外传递
- (void)userContentController:(WKUserContentController *)userContentController didReceiveScriptMessage:(WKScriptMessage *)message {
if ([self.scriptDelegate respondsToSelector:@selector(userContentController:didReceiveScriptMessage:)]) {
[self.scriptDelegate userContentController:userContentController didReceiveScriptMessage:message];
}
}
@end
3. JavaScriptCore
首先需要导入JavaScriptCore.framework框架
//为JavaScript的执行提供运行环境，上下文，
#import "JSContext.h"
//JSValue都是通过JSContext返回或者创建的，通过JSValue对OC、JS进行类型转换
#import "JSValue.h"
//主要用途是解决JSValue对象在Objective-C 堆上的安全引用问题，一般不用
#import "JSManagedValue.h"
//JS 虚拟机 ,一般不需要手动创建，在创建JSContext会帮我们自动创建，是线程安全的
#import "JSVirtualMachine.h"
//JSExport是一个协议类
#import "JSExport.h"
流程：
JS 调用 native
-
在webViewDidFinishLoad 中，注册native要调用的JS方法。
比如js中的方法名称为
callFunc有一个参数- (void)webViewDidFinishLoad:(UIWebView *)webView{ //通过webview绑定js上下文 JSContext * jsContext = [webView valueForKeyPath:@"documentView.webView.mainFrame.javaScriptContext"]; // 注册js方法 jsContext[@"callFunc"] =^(id obj){ //在这里处理js传递过来的信息 }; //异常信息处理 jsContext.exceptionHandler = ^(JSContext *context, JSValue *exceptionValue) { context.exception = exceptionValue; //比如把js中的方法名改掉，OC找不到相应方法，这里就会打印异常信息 NSLog(@"异常信息：%@", exceptionValue); }; }这样当js内，调用callFunc方法时，就会在这里被捕获到进行处理。
native 调用js
-
获取js上下文
//通过webview绑定js上下文 JSContext * jsContext = [self.webView valueForKeyPath:@"documentView.webView.mainFrame.javaScriptContext"]; -
调用JS方法
方法1: 使用JSContext的方法
-evaluateScript//showAlert 为 js中的方法， yoyoyo为传递过去的参数 NSString *jsStr = @"showAlert('yoyoyo')"; [jsContext evaluateScript:jsStr];
方式2: 使用JSValue的方法-callWithArguments
- (void)ocCallJS2{//直接调用该方法实现OC调用JS，并传参
//获取方法1
JSValue *ocCallJS = [self.jsContext objectForKeyedSubscript:@"showAlert"];
//获取方法2，与上面获取方式一样
JSValue *ocCallJS = self.jsContext[@"showAlert"];
//设置参数
NSArray * argus = @[@"hahaha"];
//进行调用
JSValue *returnValue = [ocCallJS callWithArguments:argus];
NSString *title = returnValue.toString;
}
方式3： 利用UIWebView的API stringByEvaluatingJavaScriptFromString
使用场景：js调用native，native处理后，将处理结果回传给js
- (void)addPayActionWithContext:(JSContext *)context
{
//调用native支付
context[@"payAction"] = ^() {
NSArray *args = [JSContext currentArguments];
if (args.count < 4) {
return ;
}
NSString *orderNo = [args[0] toString];
NSString *channel = [args[1] toString];
long long amount = [[args[2] toNumber] longLongValue];
NSString *subject = [args[3] toString];
// 支付操作
NSLog(@"orderNo:%@---channel:%@---amount:%lld---subject:%@",orderNo,channel,amount,subject);
// 将支付结果回传给js
[[JSContext currentContext][@"payResult"] callWithArguments:@[@"支付成功"]];
};
}
注意点
避免循环引用，因为block 会持有外部变量，而JSContext也会强引用它所有的变量，因此在block中调用self时，要用__weak 转一下。
而且在block内部要使用外部的context 以及JSValue，都会导致循环引用。如果要使用context 可以使用
[JSContext currentContext]。当然我们可以将JSContext 和JSValue当做block的参数传进去。