OC与JS交互之JavaScriptCore
JavaScriptCore提供了JavaScript和Objective-C桥接的Obj-C API。JavaScriptCore提供了让我们脱离UIWebView执行JavaScript脚本的能力,以及使用现代的Objective-C语法(例如Blocks和下标)在Objective-C和JavaScript之间无缝的传递值或者对象。借助JavaScriptCore,我们只需要很少的代码就可以完成OC与JS的交互通信,下面让我们一睹它的风采。同样,这篇文章会用JavaScriptCore有关API重写上一篇文章
一、JavaScriptCore概述
使用JavaScriptCore需要导入头文件"#import <JavaScriptCore/JavaScriptCore.h>",进入头文件我们会看到里面的类不多,只有下面5个:
#import "JSContext.h"
#import "JSValue.h"
#import "JSManagedValue.h"
#import "JSVirtualMachine.h"
#import "JSExport.h"
JSContext: 代表JavaScript的运行环境,创建JSContext后,可以来执行JavaScript代码。
JSValue: 代表JavaScript实体,一个JSValue可以是JavaScript中的任意类型:字符串和数字;数组、对象和方法;甚至错误和特殊的 JavaScript 值诸如 null
和 undefined
。任何JSContext的值都被包裹在一个JSValue
对象中。
JSManagedValue: 本质上是一个JSValue,用来处理内存管理中的一些特殊情形,它能帮助OC引用技术和JS垃圾回收这两种内存管理机制之间进行正确的转换。
JSExport: 这是一个协议,可以用这个协议来将原生对象导出给JavaScript,这样原生对象的属性或方法就成为了JavaScript的属性或方法。
JSVirtualMachine: 代表一个对象空间,拥有自己的堆结构和垃圾回收机制,是运行JS代码的基础。大部分情况下不需要和它直接交互,除非要处理一些特殊的多线程或者内存管理问题。
二、JavaScriptCore深入
1. 方法调用
a. OC调用JS
//使用UIWebView执行js脚本的方法
- (nullable NSString *)stringByEvaluatingJavaScriptFromString:(NSString *)script; //使用JSContext执行js脚本的方法
- (JSValue *)evaluateScript:(NSString *)script; //使用JSValuet执行js脚本的方法
- (JSValue *)callWithArguments:(NSArray *)arguments;
b. JS调用OC
有两种方式:block和JSExport协议
通过block可以直接讲某个功能的函数,注入给JSContext,使其调用,但要注意内存泄露
通过继承JSExport协议,可以将OC的方法,属性注入给JSContext,然后调用
2. 错误处理
当JavaScript运行时出现异常,会回调JSContext的exceptionHandler中设置的Block,然后在OC端进行错误处理
context.exceptionHandler = ^(JSContext *context, JSValue *exception) {
NSLog(@"JS Error: %@", exception);
};
3. 内存管理
Objective-C的内存管理机制是引用计数,JavaScript的内存管理机制是垃圾回收。在大部分情况下,JavaScriptCore能做到在这两种内存管理机制之间无缝无错转换,但也有少数情况需要使用到JSManagedValue对象解决,后面会给出对应链接。
三、使用JavaScriptCore重写
沿用之前的示例,其他地方均无改动,只修改了两边交互的相关代码:
OC端:
1. 初始化JScontext
self.jsContext = [self.webView valueForKeyPath:@"documentView.webView.mainFrame.javaScriptContext"];
2. 注入JS代码
__block typeof(self) weakSelf = self;
//JS调用OC方法列表
self.jsContext[@"showMobile"] = ^ {
dispatch_async(dispatch_get_main_queue(), ^{
[weakSelf showMsg:@"我是下面的小红 手机号是:18870707070"];
});
}; self.jsContext[@"showName"] = ^ (NSString *name) {
dispatch_async(dispatch_get_main_queue(), ^{
NSString *info = [NSString stringWithFormat:@"你好 %@, 很高兴见到你",name];
[weakSelf showMsg:info];
});
}; void (^_showSendMsg) (NSString *num, NSString *msg) = ^ (NSString *num, NSString *msg) {
dispatch_async(dispatch_get_main_queue(), ^{
NSString *info = [NSString stringWithFormat:@"这是我的手机号: %@, %@ !!",num,msg];
[self showMsg:info];
});
}; [self.jsContext setObject:_showSendMsg forKeyedSubscript:@"showSendMsg"];
3. 执行JS端代码
//OC调用JS方法列表
- (IBAction)btnClick:(UIButton *)sender {
if (sender.tag == 123) {
//使用jsContext
[self.jsContext evaluateScript:@"alertMobile()"];
} if (sender.tag == 234) {
//使用webView
[self.webView stringByEvaluatingJavaScriptFromString:@"alertName('小红')"];
} if (sender.tag == 345) {
//使用jsValue
JSValue *jsValue = [self.jsContext objectForKeyedSubscript:@"alertSendMsg"];
[jsValue callWithArguments:@[@"18870707070",@"周末爬山真是件愉快的事情"]];
}
}
JS端:
//提供给OC调用JS的方法列表
function alertMobile() {
alert('我是上面的小黄 手机号是:13300001111')
} function alertName(msg) {
alert('你好 ' + msg + ', 我也很高兴见到你')
} function alertSendMsg(num,msg) {
alert('这是我的手机号:' + num + ',' + msg + '!!')
} //JS响应方法列表
function btnClick1() {
showMobile()
} function btnClick2() {
showName('xiaohuang')
} function btnClick3() {
showSendMsg('13300001111', 'Go Climbing This Weekend !!!')
}
了解过JavaScriptCore的原理及核心文件,核心类的作用,再过来上手重写,已经没有什么什么阻碍了,但是仍然有需要注意的地方。因为JavaScript是单线程的,在JS调用OC的代码都是在线程中执行的,所以和界面相关操作我们需要切换到主线程来刷新,其他流程和之前保持一致,学习这一部分参考了很多其他资料,文章后面给出了有关JavaScriptCore的介绍和实现原理解析的文章链接,有兴趣的同学可以传送之深入学习
四、后记
苹果的技术每年都会更新,在JavaScript这一块,每年也会出现新的惊喜,iOS8发布的时候,苹果又推出了WKWebView,对之前的UIWebView进行了一次脱胎换骨的重构(将UIWebView和UIWebViewDelegate重构成了14个类和3个协议),功能也更加完善和强大,稳定性和性能也明显提高。之前看到过一篇文章,详细介绍了WKWebView的相关API,对我了解这一模块提供了很大的帮助,后面我也系统的看完了整个WKWebView的API,受益匪浅,看的时候,我没有直接过去看这篇文章,而是先自己通读API然后对比这篇文章,查看理解方面的出入,同时也加深了印象,同学们也可以借鉴这种方式。下一篇文章,我们使用WKWebView的相关API来完成这个示例
戳这里:本文的DEMO地址欢迎star
参考资料(戳这里):
> http://nshipster.cn/javascriptcore/
> https://hjgitbook.gitbooks.io/ios/content/04-technical-research/04-javascriptcore-note.html
OC与JS交互之JavaScriptCore的更多相关文章
- OC和JS交互的三种方法
看简书上说一共有六种OC和JS交互的方法,但是前三种原理都一致,都是通过检测.拦截Url地址实现互相调用的.剩下的react native等第三方框架原理不一样,也没有去研究,下边记录我使用的三种方法 ...
- iOS(UIWebView 和WKWebView)OC与JS交互 之二
在iOS应用的开发过程中,我们经常会使用到WebView,当我们对WebView进行操作的时候,有时会需要进行源生的操作.那么我记下来就与大家分享一下OC与JS交互. 首先先说第一种方法,并没有牵扯O ...
- OC与JS交互之WebViewJavascriptBridge
上一篇文章介绍了通过UIWebView实现了OC与JS交互的可能性及实现的原理,并且简单的实现了一个小的示例DEMO,当然也有一部分遗留问题,使用原生实现过程比较繁琐,代码难以维护.这篇文章主要介绍下 ...
- OC与JS交互之UIWebView
随着H5的强大,hybrid app已经成为当前互联网的大方向,单纯的native app和web app在某些方面显得就很劣势.关于H5的发展史,这里有一篇文章推荐给大家,今天我们来学习最基础的基于 ...
- Mac Webview OC与JS交互实现
1.首先,需要定义一个JS可识别的变量(如external)用于OC与JS交互 - (void)webView:(WebView *)sender didClearWindowObject:(WebS ...
- OC与JS交互前言
OC与JS交互过程中,可能会需要使用本地image资源及html,css,js文件,这些资源应该如何被加载? 一.WebView加载HTML UIWebView提供了三个方法来加载html资源 1. ...
- iOS(WKWebView)OC与JS交互 之三
随着H5功能愈发的强大,没进行过混合开发的小伙们都不好意思说自己能够独立进行iOS的app开发,在iOS7操作系统下,常用的native,js交互框架有easy-js,WebViewJavascr ...
- OC与JS交互之WKWebView
上一篇文章我们使用了JavaScriptCore框架重写了之前的示例,iOS8苹果偏爱HTML5,重构了UIWebVIew,给我们带来了WKWebView,使其性能.稳定性.功能大幅度提升,也更好的支 ...
- OC与JS交互
https://www.jianshu.com/p/bb666b71e104 一.简述 目前原生与JS交互的方式有以下几种 JavaScriptCore WKWebView 拦截URL WebView ...
随机推荐
- [BZOJ2049] [SDOI2008] 洞穴勘测
题目描述 辉辉热衷于洞穴勘测. 某天,他按照地图来到了一片被标记为JSZX的洞穴群地区.经过初步勘测,辉辉发现这片区域由n个洞穴(分别编号为1到n)以及若干通道组成,并且每条通道连接了恰好两个洞穴.假 ...
- [ActionScript 3.0] 动态链接库
很多时候,我们为了项目和程序结构更加清晰,需要将发布好的swf放到一个固定的地方供主文件引用,这时就会出现发布好的swf所用的as类路径发生改变,为避免这个问题,需要用到动态链接库,以下做一个简单例子 ...
- myeclipse关于svn更新报错:OPTIONS of '/svn/Xxx': 403 Forbidden
这个问题出现原因是其他人修改了我原本写作的代码位置,把两个类转移到了别的文件夹,我更新之后只显示除了他增加的文件夹而没有里面的类,同时爆出错误: 问题原因:svn版本号不匹配,即跳版本. 解决如下:r ...
- UDP与IP分片
一.引言  UDP是简单的面向数据报的运输层协议.UDP不提供可靠性:它负责把应用程序传给IP层的数据发送出去,不保证能导到目的地. 二.UDP首部  端口号表示发送进程和接受进程.由于IP层已经 ...
- 【转】【C++专题】C++ sizeof 使用规则及陷阱分析
提示:下文例子都经过Visual C++ 6.0验证,平台为win32 Windows. 一.什么是sizeof 首先看一下sizeof在msdn上的定义: The sizeof keyword gi ...
- leetcode-665-Non-decreasing Array
题目描述: Given an array with n integers, your task is to check if it could become non-decreasing by mod ...
- 一次http请求响应流程
前端客户端 发起http请求 web服务器接收并解析http报文 通过WSGI协议发送给web框架 web框架创建请求对象 中间层处理 具体的视图处理-业务处理 中间层处理 创建http响应对象 返回 ...
- 2016级算法第一次练习赛-B.朴素的中位数
朴素的中位数 题目链接:https://buaacoding.cn/problem/846/index 分析 题意很简单,就是给定了两个从小到大排好序的数组,找出这两个数组合起来的数据中的中位数. 方 ...
- 复制订阅服务器和 AlwaysOn 可用性组 (SQL Server)
https://docs.microsoft.com/zh-cn/sql/database-engine/availability-groups/windows/replication-subscri ...
- 利用java实现一个简单的链表结构
*博客搬家:初版发布于 2014/07/04 定义: 所谓链表就是指在某节点存储数据的过程中还要有一个属性用来指向下一个链表节点,这样的数据存储方式叫做链表 链表优缺点: 优点:易于存储和删除 缺点: ...