JavaScriptCore 时代的通讯
iOS 7 开始,苹果提供了一个叫作 JavaScriptCore 的框架,使用 JavaScriptCore 框架可以实现 OC 和 JS 的互相调用,而不需要依赖「桥」来实现,怎么通讯呢?
JavaScriptCore 中 OC 调用 JS 方法
在 JS 中定义一个方法
1 2 3 | function alertFunc() { window.alert("这是一个JS中的弹框!") } |
在 webViewDidFinishLoad:
代理方法中,获取到 JSContext
对象(在这里用到的就是这个方法:
)
1 2 3 4 5 6 7 8 9 | - (void)webViewDidFinishLoad:(UIWebView *)webView { JSContext *context = [self.webView valueForKeyPath:@"documentView.webView.mainFrame.javaScriptContext"]; [context setExceptionHandler:^(JSContext *ctx, JSValue *expectValue) { NSLog(@"%@", expectValue); }]; self.context = context; } |
在一个 button 的点击事件中可以根据 JS 定义的方法的名字获得一个 JSValue 类型对象,这个对象就是在 JS 中定义的方法,JSValue 对象通过调用 callWithArguments:
方法,执行这个 JS 方法。
1 2 3 4 5 6 7 8 | - (IBAction)buttonClick:(UIButton *)sender { if (!self.context) { return; } JSValue *funcValue = self.context[@"alertFunc"]; [funcValue callWithArguments:nil]; } |
点击按钮时,效果如下。
实现了 OC 中调用 JS 的方法。
JS 调用 OC 中的方法
在 OC 中,通过给 JSContext 的一个 key
赋值,值为一个 block,key
是 JS 中调用的方法的名字,代码如下:
在这里需要提一下,这里用到了weak-strong dance,用weak是为了防止循环引用,用weak-strong dance是为了在block内部能够访问到self的属性,所以就使用weak-strong dance。但是在xcode7.3之后就不需要使用weak-strong dance了,因为系统已经升级,不需要weak-strong dance依然能够访问到self的属性(使用weakSelf即可)。
1 2 3 4 5 6 7 8 9 10 11 12 13 | self.context[@"ocAlert"] = ^{ // block 异步执行,如果涉及到 UI 的操作需要回到主线程操作 dispatch_async(dispatch_get_main_queue(), ^{ __strong typeof(weakSelf) strongSelf = weakSelf; UIAlertController *alert = [UIAlertController alertControllerWithTitle:@"" message:@"这是OC中的弹框!" preferredStyle:UIAlertControllerStyleAlert]; [alert addAction:[UIAlertAction actionWithTitle:@"确定" style:UIAlertActionStyleDefault handler:^(UIAlertAction * _Nonnull action) { [alert dismissViewControllerAnimated:YES completion:^{ }]; }]]; [strongSelf.navigationController presentViewController:alert animated:YES completion:nil]; }); }; |
在 Web 页面中创建一个 button 并设置 button 的 onClick 事件调用 ocAlert
方法
1 | <button onclick="ocAlert()">点击这里</button> |
点击 Web 页面上的 button 按钮,效果如下
实现了 JS 调用 OC 中的方法。
是不是方便了很多?
写在后面
以上当然只是 JavaScriptCore 框架的一个很小的应用,使用 JavaSciptCore 框架结合 Objective-C 的动态性可以做很多事,比如著名的热修复框架 JSPatch 就是这两者的结合。这里只是演示了 JS 和 OC 之间的方法调用,并没有传输数据,JavaScriptCore 框架是很容易的实现两者之间的数据传输的。
使用 JavaScriptCore 实现通讯的 demo 放到了 GitHub,地址如下:
https://github.com/cielpy/CPYJSCoreDemo
这篇文章是整理了Kevin Guo的博客,然后把自己理解结合了一下。