iOS7之后,苹果推出了JavaScriptCore,是WebKit的一个重要组成部分,对JS进行解析和提供运行环境。
JSContext
JS上下文,提供运行环境,同时也通过JSVirtualMachine管理着所有对象的生命周期,每个JSValue都和JSContext相关联并且强引用context。
JSValue
JS和OC互换的桥梁,它提供了多种方法实现OC与JS之间的互换。
JSManagedValue
JS和OC对象的内存管理辅助对象。由于JS内存管理是垃圾回收,并且JS中的对象都是强引用,而OC是引用计数。如果双方相互引用,势必会造成循环引用,而导致内存泄露。我们可以用JSManagedValue保存JSValue来避免。
JSVirtualMachine
JS运行的虚拟机,有独立的堆空间和垃圾回收机制。- (id)initWithVirtualMachine:(JSVirtualMachine *)virtualMachine;,如果是使用- (id)init;进行初始化,那么在其内部会自动创建一个新的JSVirtualMachine对象然后调用前边的初始化方法。
JSExport
一个协议,如果JS对象想直接调用OC对象里面的方法和属性,那么这个OC对象只要实现这个JSExport协议就可以了。
OC中调用JS
从JS环境里取函数或者变量,就是将一段JS代码通过JSContext转化为OC执行。
#pragma mark - 加载一段JS代码
-(void)OCCallJS
{
JSContext *context = [self.webView valueForKeyPath:@"documentView.webView.mainFrame.javaScriptContext"];
NSString *jsString = [NSString stringWithFormat:@"alert('%@')",@"这是OC调用JS"];
[context evaluateScript:jsString];
}
当JS代码多,直接食用字符串转化可能会出现错误,此时可以读取本地.html/.js文件来实现
#pragma mark - 加载本地.js文件
-(void)loadScriptWithContext:(JSContext *)context AndFileName:(NSString *)fileName
{
NSString *filePath = [NSString stringWithFormat:@"%@/JS/%@",[[NSBundle mainBundle] resourcePath],fileName];
NSString *script = [NSString stringWithContentsOfFile:filePath encoding:NSUTF8StringEncoding error:nil];
[context evaluateScript:script];
}
//加载.html文件
NSURL *htmlURL = [[NSBundle mainBundle]URLForResource:@"js.html" withExtension:nil];
NSURLRequest *request = [NSURLRequest requestWithURL:htmlURL];
[self.webView loadRequest:request];
JS中调用OC
方法一:将block注入JSContext上下文,在JS执行的时候调用OC原生方法
方法二:将OC对象注入JSContext上下文,在JS执行的时候调用OC原生方法
一般写在UIWebView的delegate中
- (void)webViewDidFinishLoad:(UIWebView *)webView
{
//JS调OC方法一
//首先创建JSContext 对象(此处通过当前webView的键获取到jscontext)
JSContext *context1 = [webView valueForKeyPath:@"documentView.webView.mainFrame.javaScriptContext"];
context1[@"JSCallOCWithBlock"] = ^(NSString *str){
NSLog(@"OC的Block被调用:%@",str);
};
//JS调OC方法二
JSContext *context2 = [webView valueForKeyPath:@"documentView.webView.mainFrame.javaScriptContext"];
GemJSObject *jsObject = [[GemJSObject alloc]init]; //创造一个对象
jsObject.x = 10;
context2[@"JSCallOCWithObject"] = jsObject; //将对象注入JS运行环境
}
OC对象中的代码
#pragma mark - GemJSObject.h
#import <Foundation/Foundation.h>
#import <JavaScriptCore/JavaScriptCore.h>
@protocol GemJSObjectExport <JSExport>
//定义要暴露给JS的属性和方法,JS就可以对其操作了
@property int x;
-(void)nslog:(NSString *)str;
@end
@interface GemJSObject : NSObject<GemJSObjectExport>
-(void)nslog:(NSString *)str;
@end
#pragma mark - GemJSObject.m
#import "GemJSObject.h"
@implementation GemJSObject
@synthesize x;
-(void)nslog:(NSString *)str
{
NSLog(@"%d",self.x * self.x);
NSLog(@"OC的nslog方法被调用:%@",str);
}
@end
js.html文件中的JS代码
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>test javascript</title>
</head>
<body>
<div>
<!--
调用方法(并传入参数,若block中无参,则此参数无用)
-->
<button onclick="JSCallOCWithBlock('JS调用OC方法,并传参(通过block)');">JS_OC_Block</button>
<br>
<!--
调用对象的nslog方法(并传入参数),对象需要传入自定义的NSObject对象(遵循JSExport协议)
-->
<button onclick="JSCallOCWithObject.nslog('JS调用OC方法,并传参(通过GemJSObject对象)');">JS_OC_Object</button>
</div>
</body>
</html>
方法三:拦截非正常的URL
- (BOOL)webView:(UIWebView *)webView shouldStartLoadWithRequest:(NSURLRequest *)request navigationType:(UIWebViewNavigationType)navigationType
{
//JS调OC方法三:拦截不正常URL
if ([request.URL.absoluteString isEqualToString:@"非正常的URL头"]) {
//调用OC的方法
[self handleCustomAction:request.URL];
return NO;
}
return YES;
}
-(void)handleCustomAction:(NSURL *)url
{
if ([url.host isEqualToString:@"getLocation"]) {
[self getLocation];
}
}
-(void)getLocation
{
//获取位置信息,将结果返回给js
NSString *jsStr = [NSString stringWithFormat:@"setLocation('%@')",@"北京市朝阳区XXX号"];
[self.webView stringByEvaluatingJavaScriptFromString:jsStr];
/**
补充:在JS代码中调OC,也需要传参数到OC中,就像一个get请求一样,把参数放在后面。
function shareClick() {
loadURL("haleyAction://shareClick?title=测试分享的标题&content=测试分享的内容&url=http://www.baidu.com");
}
*/
}
实际应用中,可能会遇见浏览webView图片的情况,我的GitHub有相关demo可参考浏览webView图片demo