iOS WKWebView 与 js 交互

iOS8之后苹果推荐使用WKWebView替代UIWebView，其主要的有点有：

WKWebView更多的支持HTML5的特性
WKWebView更快，占用内存可能只有UIWebView的1/3 ~ 1/4
WKWebView高达60fps的滚动刷新率和丰富的内置手势
WKWebView具有Safari相同的JavaScript引擎
WKWebView增加了加载进度属性

关于 WKWebView 的具体使用方法在这里就不细细阐述了, 网上的各路大佬已经说的够详细了.

最近在项目中遇到了这样的一种情景, 在 web 网页上触发一个事件, 然后用native 做一些处理. 这差不多就是嵌入网页的 app 最常见的一个情景了, 下面给大家介绍wkwebView 如何处理这种情景:

1.与 js 端确定一个名字

//需要 js 传数据给 iOS
window.webkit.messageHandlers.msgHandlerName.postMessage({key:'value'});

//不需要传数据给 iOS
window.webkit.messageHandlers.msgHandlerName.postMessage(null);

js 端主要是通过上面这行代码来传给 ios 一些数据, 其中的 msgHandlerName 就是要和 js 端确定的名称.

2.添加 script 监听

        WKUserContentController *controller = [[WKUserContentController alloc] init];
        [controller addScriptMessageHandler:self name:@"msgHandlerName"];

3.实现 WKScriptMessageHandler 协议方法

wkwebView 的WKScriptMessageHandler协议方法是:

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

在这个方法里可以通过 message.name 来判断js 端是否触发了事件.完整代码:

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

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

   // do something

    }

}

以上就是 js 调用 oc 的全部流程, 不对之处, 还望不吝指正!