WKWebView 使用详解

前言

WKWebView是在Apple的WWDC 2014发布，将原有UIWebViewDelegate与UIWebView重构成了14类与3个协议。
WKWebView，在iOS8和OS X 10.10开始支持，是为了解决UIWebView加载速度慢、占用内存大的问题。
在使用UIWebView加载网页的时候，会出现内存会无限增长，内存泄漏的问题。
WebKit中WKWebView控件的特性与使用方法，很好的解决了UIWebView存在的内存、加载速度等诸多问题。

一、WKWebView 特性

• 占用更少的内存
• Safari相同的JavaScript引擎
• 支持了更多的HTML5特性；
• 支持手势返回
• 滚动刷新率可达到60fps，堪比native

webkit

WebKit.png

OC与JS交互

WKWebview提供了API实现js交互 不需要借助JavaScriptCore或者webJavaScriptBridge。

WKWebView

WKWebView对象显示交互式Web内容，例如针对应用内浏览器。 您可以使用WKWebView类将Web内容嵌入到您的应用程序中。 只需要创建一个WKWebView对象，并向其发送加载Web内容的请求。
API

初始化

- (instancetype)initWithFrame:(CGRect)frame configuration:(WKWebViewConfiguration *)configuration

常用方法

- (nullable WKNavigation *)loadRequest:(NSURLRequest *)request;
- (nullable WKNavigation *)loadHTMLString:(NSString *)string baseURL:(nullable NSURL *)baseURL;
- (nullable WKNavigation *)goBack;
- (nullable WKNavigation *)goForward;
// Reloads the current page.
- (nullable WKNavigation *)reload;
- (nullable WKNavigation *)reloadFromOrigin;

WKNavigtionDelegate

// 页面开始加载时调用
- (void)webView:(WKWebView *)webView didStartProvisionalNavigation:(WKNavigation *)navigation;
// 当内容开始返回时调用
- (void)webView:(WKWebView *)webView didCommitNavigation:(WKNavigation *)navigation;
// 页面加载完成之后调用
- (void)webView:(WKWebView *)webView didFinishNavigation:(WKNavigation *)navigation;
// 页面加载失败时调用
- (void)webView:(WKWebView *)webView didFailProvisionalNavigation:(WKNavigation *)navigation;
// 接收到服务器跳转请求之后再执行
- (void)webView:(WKWebView *)webView didReceiveServerRedirectForProvisionalNavigation:(WKNavigation *)navigation;
// 在收到响应后，决定是否跳转
- (void)webView:(WKWebView *)webView decidePolicyForNavigationResponse:(WKNavigationResponse *)navigationResponse decisionHandler:(void (^)(WKNavigationResponsePolicy))decisionHandler;
// 在发送请求之前，决定是否跳转
- (void)webView:(WKWebView *)webView decidePolicyForNavigationAction:(WKNavigationAction *)navigationAction decisionHandler:(void (^)(WKNavigationActionPolicy))decisionHandler;

WKUIDelegate

//1.创建一个新的WebVeiw
- (nullable WKWebView *)webView:(WKWebView *)webView createWebViewWithConfiguration:(WKWebViewConfiguration *)configuration forNavigationAction:(WKNavigationAction *)navigationAction windowFeatures:(WKWindowFeatures *)windowFeatures;
//2.WebVeiw关闭（9.0中的新方法）
- (void)webViewDidClose:(WKWebView *)webView NS_AVAILABLE(10_11, 9_0);
//3.显示一个JS的Alert（与JS交互）
- (void)webView:(WKWebView *)webView runJavaScriptAlertPanelWithMessage:(NSString *)message initiatedByFrame:(WKFrameInfo *)frame completionHandler:(void (^)(void))completionHandler;
//4.弹出一个输入框（与JS交互的）
- (void)webView:(WKWebView *)webView runJavaScriptTextInputPanelWithPrompt:(NSString *)prompt defaultText:(nullable NSString *)defaultText initiatedByFrame:(WKFrameInfo *)frame completionHandler:(void (^)(NSString * __nullable result))completionHandler;
//5.显示一个确认框（JS的）
- (void)webView:(WKWebView *)webView runJavaScriptConfirmPanelWithMessage:(NSString *)message initiatedByFrame:(WKFrameInfo *)frame completionHandler:(void (^)(BOOL result))completionHandler;

JS调用OC

使用WKUserContentController实现js=>native交互。简单的说就是先注册约定好的方法，然后再调用。
流程图：

op=>operation: 配置环境
op1=>operation: 注册方法
op->op1

代码：

//配置环境，使用WKWebViewConfiguration
WKWebViewConfiguration *configuration = [[WKWebViewConfiguration alloc] init];
configuration.allowsInlineMediaPlayback = YES;
WKUserContentController *userContentController = [[WKUserContentController alloc] init];
configuration.userContentController = userContentController;
//注册方法
／*
self.hybrid 是WTWebViewJSBridge类实例，处理js调用native方法
BridgeName js 方法名
*／
[userContentController addScriptMessageHandler:self.hybrid name:BridgeName];

JS回调处理

//WTWebViewJSBridge.m
- (void)userContentController:(WKUserContentController *)userContentController didReceiveScriptMessage:(WKScriptMessage *)message
{
    if ([message.name isEqualToString:BridgeName]) {
        if ([message.body isKindOfClass:[NSDictionary class]]) {
            [self postMessage:message.body];
        }
    }
}

OC调用JS

这个简单多了，直接用WKWebview，evaluateJavaScript方法进行调用

- (void)evaluateJavaScript:(NSString *)javaScriptString completionHandler:(void (^)(id, NSError *))completionHandler
{
    if (self.webkit) {
        [self.webkit evaluateJavaScript:javaScriptString completionHandler:completionHandler];
    }
}

详细Demo地址

参考作者：

iOS开发之WKWebView简单使用和常用使用场景
iOS开发 - WKWebView使用详解