iOS开发中OC与JS交互（UIWebView）
iOS开发中OC与JS交互（UIWebView）
版权声明：本文为博主原创文章，未经博主允许不得转载。 https://cloud.tencent.com/developer/article/1337804
之前虽然做过OC与JS交互，但都是比较简单的效果：点击网页中的图片，然后进行图片浏览。现在对OC与JS交互这块也不是很清楚，今天只是把之前的代码贴过来以便今后更好地理解OC与JS的交互。
首先需要往网页中注入JS。注入JS的工作是后台做的。可好像安卓和iOS还是有区别的，因为之前安卓那边可以实现与JS的交互，而我这边却不能。后台后台修改了代码，我这边也就可以进行交互了。
JS代码：
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
<scripttype="text/javascript">
var share = JSON.stringify({"title":"呵呵",
"desc":"哈哈",
"shareUrl":"http://www.baidu.com"
});
function startFunction(share){
window.android.startFunction(share)//android
}
</script>
</head>
<body>
<br/>
<h1>Objective-C和JavaScript交互的那些事</h1><br/>
<input type="button"value="Share"onClick="startFunction(share)" >点击调用原生代码并传递参数</a>
</body></html>
客户端代码：
self.webView = [UIWebViewallocinitWithFrame:self.view.bounds];
self.webView.delegate =self;
self.viewaddSubview:_webView;
NSString *str = [NSBundlemainBundlepathForResource:@"ExampleApp"ofType:@"html"];
[self.webViewloadRequest:[NSURLRequestrequestWithURL:NSURLfileURLWithPath:str]];
- (void)webViewDidFinishLoad:(UIWebView *)webView{
_jsContext = webViewvalueForKeyPath:@"documentView.webView.mainFrame.javaScriptContext";
_jsContext@"startFunction" =^(id obj){
////这里通过block回调从而获得h5传来的json数据
/*block中捕获JSContexts
我们知道block会默认强引用它所捕获的对象，如下代码所示，如果block中直接使用context也会造成循环引用，这使用我们最好采用JSContext currentContext来获取当前的JSContext:
*/
JSContextcurrentContext;
NSData *data = (NSString *)objdataUsingEncoding:NSUTF8StringEncoding ;
NSDictionary *dict = NSJSONSerializationJSONObjectWithData:dataoptions:NSJSONReadingMutableContainerserror:nil;
NSLog(@" data %@ ====== ShareUrl %@",obj,dict@"shareUrl");
};
//
_jsContext.exceptionHandler = ^(JSContext *context,JSValue *exceptionValue) {
context.exception = exceptionValue;
//比如把js中的方法名改掉，OC找不到相应方法，这里就会打印异常信息
NSLog(@"异常信息：%@", exceptionValue);
};
}
苹果有了
<JavaScriptCore/JavaScriptCore.h>
这个库之后就可以使用JSContext这个类了。
补充：
之前底牌项目中的代码，实现点击图片显示图片的功能。
- (void)webViewDidFinishLoad:(UIWebView *)webView{
NSLog(@"加载完成...");
JSContext *context = _webView valueForKeyPath:@"documentView.webView.mainFrame.javaScriptContext";
NSLog(@"%@", context);
context@"image_add_i" = ^() {//通过block回调获得h5传来的数据
NSArray *args = JSContextcurrentArguments;
// 数组中装数组
self.picsArrremoveAllObjects;
self.picsArraddObject:args;
};
context@"image_show_i" = ^() {
NSArray *args = JSContextcurrentArguments;
// NSLog(@"%@", args);
for (JSValue *jsVal in args) {
// NSLog(@"%@", jsVal);
_picIndex = jsVal;
// 展示图片
selfshowBigPic;
}
JSValue *this = JSContextcurrentThis;
NSLog(@"this: %@",this);
};
}
在每次点击图片的时候都要掉用content@"image_show_i"...这段代码，这段代码的目的是获取当前点击图片的下标.
附上利用WKWebView加载网页OC与JS的交互的地址：