由于Xcode8发布之后,编译器开始不支持iOS 7了,这样我们的app也改为最低支持iOS 8.0,既然需要与web交互,那自然也就选择使用了 iOS 8.0之后 才推出的新控件 WKWebView.
相比与 UIWebView, WKWebView 存在很多优势:
- 支持更多的HTML5的特性
- 高达60fps滚动刷新频率与内置手势
- 与Safari相容的JavaScript引擎
- 在性能、稳定性方面有很大提升占用内存更少 协议方法及功能都更细致
- 可获取加载进度等。
UIWebView与JS的交互方式
一,OC调用JS
直接调用苹果提供的API
1
|
- (nullable NSString *)stringByEvaluatingJavaScriptFromString:(NSString *)script; |
使用方式:
OC部分:
1
|
[self.webView stringByEvaluatingJavaScriptFromString:@ "add(1,2)" ]; |
JS部分:
1
2
3
|
function add(a,b) { return a+b; } |
二,JS调用OC
OC处理JS的时机在UIWebView的代理方法内
1
|
- ( BOOL )webView:(UIWebView *)webView shouldStartLoadWithRequest:(NSURLRequest *)request navigationType:(UIWebViewNavigationType)navigationType; |
使用方式:
JS部分:
1
2
3
|
function btnClick1() { location.href = "jsCallBack://method_?param1¶m2" } |
OC部分:
1
2
3
4
5
|
NSString *schem = webView.request.URL.scheme; if ([schem containsString:@ "jsCallBack://" ]) { //action... return NO; } |
WKWebView与JS的交互方式
一,OC调用JS
调用苹果提供的API
1
|
- ( void )evaluateJavaScript:(NSString *)javaScriptString completionHandler:( void (^ _Nullable)(_Nullable id, NSError * _Nullable error))completionHandler; |
使用方式:
OC部分:
1
|
[self.wkWebView evaluateJavaScript:@ "playSount()" completionHandler:nil]; |
JS部分:
1
2
3
|
function playSount() { //playSount... } |
二,JS调用OC
OC部分:
这种使用方式比较麻烦一些
1.在创建wkWebView时,需要将被js调用的方法注册进去
1
2
3
4
5
6
|
//创建WKWebViewConfiguration文件 WKWebViewConfiguration *config = [[WKWebViewConfiguration alloc] init]; config.preferences.minimumFontSize = 10.f; [config.userContentController addScriptMessageHandler:self name:@ "playSound" ]; //创建WKWebView类 WKWebView *webView = [[WKWebView alloc] initWithFrame:self.view.bounds configuration:config]; |
2.在WKScriptMessageHandler代理方法中监听js的调用
1
2
3
4
5
6
7
|
#pragma mark - WKScriptMessageHandler - ( void )userContentController:(WKUserContentController *)userContentController didReceiveScriptMessage:(WKScriptMessage *)message { if ([message.name isEqualToString:@ "playSound" ]) { [self playSound]; } } |
JS部分:
1
2
3
|
//JS响应事件 function btnClick() { window.webkit.messageHandlers.playSound.postMessage( null ); } |
利用JavaScriptCore库,WebView与JS的交互
一,OC调用JS
1
2
3
4
5
|
self.jsContent = [[JSContext alloc] init]; NSString *js = @ "function add(a,b) {return a + b}" ; [self.jsContent evaluateScript:js]; JSValue *jsValue = [self.jsContent[@ "add" ] callWithArguments:@[@2,@3]]; |
二,JS调用OC
1
2
3
4
5
6
|
self.jsContent = [[JSContext alloc] init]; self.jsContent[@ "add" ] = ^( int a, int b){ NSLog(@ "a+b = %d" ,a+b); }; [self.jsContent evaluateScript:@ "add(10,20)" ]; |
三,JS直接访问OC对象方法与属性
1.首先定义一个协议,这个协议遵守JSExport协议
1
2
3
4
5
|
@protocol JSExportTest <JSExport> @property (nonatomic, assign) NSInteger sum; JSExportAs(add, - (NSInteger)add:( int )a b:( int )b); @end |
其中JSExportAs()是系统提供的宏,用来声明在JS环境中方法add与OC环境中方法- (NSInteger)add:(int)a b:(int)b对应。
2.创建一类,遵守JSExportTest协议,并实现它什么的方法与属性
1
2
3
4
5
6
7
8
9
10
11
12
|
@interface JSProtolObj : NSObject <JSExportTest> @end @implementation JSProtolObj @synthesize sum = _sum; - (NSInteger)add:( int )a b:( int )b { return a+b; } - ( void )setSum:(NSInteger)sum { _sum = sum; } @end |
3.使用方式:
1
2
3
4
5
6
7
8
|
self.jsContent = [[JSContext alloc] init]; self.jsContent.exceptionHandler = ^(JSContext *context, JSValue *exception) { [JSContext currentContext].exception = exception; NSLog(@ "exception:%@" ,exception); }; self.jsContent[@ "OCobj" ] = self.jsProtolObj; [self.jsContent evaluateScript:@ "OCobj.sum = OCobj.add(10,20)" ]; |
这三种使用方式可以根据实际情况进行适当使用
总结
以上就是这篇文章的全部内容了,希望本文的内容对大家的学习或者工作具有一定的参考学习价值,如果有疑问大家可以留言交流,谢谢大家对服务器之家的支持。
原文链接:http://www.cnblogs.com/zhou--fei/p/8895041.html