WKWebView 与 JS 交互实战技巧

Xcode8发布之后Apple推出了新控件 WKWebView，WKWebView 存在很多优势支持更多的HTML5的特性、高达60fps滚动刷新频率与内置手势、与Safari相容的JavaScript引擎、在性能、稳定性方面有很大提升占用内存更少 协议方法及功能都更细致、可获取加载进度等。最主要的是大大降低了内存消耗。首先需要导入#import

实现代理：WKNavigationDelegate，WKScriptMessageHandler，WKUIDelegate。

主要代码：

WKWebViewConfiguration *config = [[WKWebViewConfiguration alloc]init];//交互用到的类库

WKWebView *webView = [[WKWebView alloc]initWithFrame:self.view.bounds configuration:config];

NSURLRequest *request = [[NSURLRequest alloc]initWithURL:[NSURL URLWithString:@"Your URL"]];

[request addValue:[USERDEFALE objectForKey:@"Token"] forHTTPHeaderField:@"token"];//添加头部信息

[webView loadRequest:request];

[self.view addSubview:webView];

实现的主要协议：

- (void)webView:(WKWebView *)webView didFinishNavigation:(WKNavigation *)navigation;

// WKNavigationDelegate 页面开始加载时调用

- (void)webView:(WKWebView *)webView didStartProvisionalNavigation:(WKNavigation *)navigation;

// WKNavigationDelegate 当内容开始返回时调用

- (void)webView:(WKWebView *)webView didCommitNavigation:(WKNavigation *)navigation;

- (void)webView:(WKWebView *)webView didFailProvisionalNavigation:(WKNavigation *)navigation withError:(NSError *)error;

- (void)webView:(WKWebView *)webView decidePolicyForNavigationAction:(WKNavigationAction *)navigationAction decisionHandler:(void (^)(WKNavigationActionPolicy))decisionHandler;

WKWebView可以直接添加对约定的ScriptMessage（直译为 脚本信息，本文暂定为JS事件）的监听，即可实现JS调用OC。所有的操作都是通过WKUserContentController来处理的

JS调用OC

首先在JS代码中加入对事先约定好的 ScriptMessage（JS事件）的调用:window.webkit.messageHandlers.<事件名>.postMessage(需要传递的数据)

同时OC端则需要加入对此JS事件的监听：window.webkit.messageHandlers.事件名.postMessage()

//主要方法，在这里处理交互信息

- (void)userContentController:(WKUserContentController *)userContentController didReceiveScriptMessage:(WKScriptMessage *)message{

if ([message.name isEqualToString:@"closeWindow"]) {

//做处理 do something ,message.body 为此 ScriptMessage 传递的消息内容

        NSLog(@"JS交互得到的message %@",message.body);

}}

移除对一个名为 @”事件名” 的JS事件的监听:[conntentController removeScriptMessageHandlerForName:@"事件名"];

OC调用JS

在- (void)evaluateJavaScript:(NSString *)javaScriptString completionHandler:(void (^ _Nullable)(_Nullable id, NSError * _Nullable error))completionHandler;操作通知知JS端的方法名和对应操作的key值 :[self.webView evaluateJavaScript:@"JS方法名('action')" completionHandler:nil];