WKWebView的使用详解

一.引言

应公司要求，把项目里用到的UIWebView全都用WKWebView替换掉。于是本人就去研究了WKWebview,加上在使用中遇到的一些问题加以总结，就写下这篇博文。如有不足的地方，还望留言指教。

二.WKWebView使用流程

1.首先你需要导入的头文件#import <WebKit/WebKit.h>
2.初始化：

webView = [[WKWebView alloc] initWithFrame:CGRectMake(0,HEADER, self.view.frame.size.width,self.view.frame.size.height-HEADER)];
webView.scrollView.backgroundColor = [UIColor whiteColor];
webView.navigationDelegate = self;
[self.view addSubview:webView];

3.使用
3.1 直接加载url地址。这里和UIWebview的用法一样。

[webView loadRequest:[NSURLRequest requestWithURL:url]];

3.2 加载本地html文件
*UIWebView的用法*
[webView loadHTMLString:资源文件名 baseURL:文件地址];

*WKWebView的用法*
WKWevView也有 loadHTMLString: baseURL:的方法，但是在调用的时候出了问题。
1.系统是9.0的可以直接用上述方法，但是以下的就不行。后来尝试了很多次才得以解决；
如下：

//调用逻辑
NSString *path = [[DataManager sharedManager].CSDownloadPath stringByAppendingPathComponent:@"css"];//获取文件夹路径

if(path){
 if ([[UIDevice currentDevice].systemVersion floatValue] >= 9.0) {
 // iOS9.
NSURL *fileURL = [NSURL fileURLWithPath:[[DataManager sharedManager].CSDownloadPath stringByAppendingPathComponent:[NSString stringWithFormat:@"css/文件名.html",]]];

[webView loadFileURL:fileURL allowingReadAccessToURL:fileURL];

} else {
// iOS8.
NSURL *fileURL = [self fileURLForBuggyWKWebView8:[NSURL fileURLWithPath:path]];

NSString *htmlString = [NSString stringWithContentsOfFile:[NSTemporaryDirectory() stringByAppendingPathComponent:[NSString stringWithFormat:@"www/css/文件名.html"]] encoding:NSUTF8StringEncoding error:nil];//获取文件路径，现在html的文件路径已经改了。

[webView loadHTMLString:htmlString baseURL:fileURL];

            }
        }

    }
}

//将文件copy到tmp目录
- (NSURL *)fileURLForBuggyWKWebView8:(NSURL *)fileURL {
    NSError *error = nil;
    if (!fileURL.fileURL || ![fileURL checkResourceIsReachableAndReturnError:&error]) {
        return nil;
    }
    // Create "/temp/www" directory
    NSFileManager *fileManager= [NSFileManager defaultManager];
    NSURL *temDirURL = [[NSURL fileURLWithPath:NSTemporaryDirectory()] URLByAppendingPathComponent:@"www"];
    [fileManager createDirectoryAtURL:temDirURL withIntermediateDirectories:YES attributes:nil error:&error];

    NSURL *dstURL = [temDirURL URLByAppendingPathComponent:fileURL.lastPathComponent];
    // Now copy given file to the temp directory
    [fileManager removeItemAtURL:dstURL error:&error];
    [fileManager copyItemAtURL:fileURL toURL:dstURL error:&error];
    // Files in "/temp/www" load flawlesly :)
    return dstURL;
}

3.3 与js的交互。
UIWebView的用法

//加载完成时调用，公司的项目，作用是让内容适应屏幕大小。
- (void)webViewDidFinishLoad:(UIWebView *)web
{
    int count = [[webView stringByEvaluatingJavaScriptFromString:@"document.images.length"] intValue];
    for (int i=0; i<count; i++) {
        [webView stringByEvaluatingJavaScriptFromString:[NSString stringWithFormat:@"document.images[%d].style.maxWidth='100%%'", i]];
        [webView stringByEvaluatingJavaScriptFromString:[NSString stringWithFormat:@"document.images[%d].style.height='auto'", i]];
    }

    [webView stringByEvaluatingJavaScriptFromString:@"document.getElementsByTagName('body')[0].style.webkitTextSizeAdjust = '60%'"];//修改百分比即可
}

WKWebView的用法

//加载完成时调用
- (void)webView:(WKWebView *)webView didFinishNavigation:(WKNavigation *)navigation {

    [webView evaluateJavaScript:[NSString stringWithFormat:@"document.images.length"] completionHandler:^(id _Nullable response, NSError * _Nullable error) {

        if (response != 0) {

            for (int i=0; i<[response intValue]; i++) {
                [webView evaluateJavaScript:[NSString stringWithFormat:@"document.images[%d].style.maxWidth='100%%'",i] completionHandler:^(id _Nullable response, NSError * _Nullable error) {
//                    NSLog(@"response1: %@ error: %@", response, error);
                }];
                [webView evaluateJavaScript:[NSString stringWithFormat:@"document.images[%d].style.height='auto'",i] completionHandler:^(id _Nullable response, NSError * _Nullable error) {
//                    NSLog(@"response2: %@ error: %@", response, error);
                }];
            }

        }
//        NSLog(@"response0: %@ error: %@", response, error);
    }];

    [webView evaluateJavaScript:@"document.getElementsByTagName('body')[0].style.webkitTextSizeAdjust = '60%'" completionHandler:^(id _Nullable response, NSError * _Nullable error) {
//        NSLog(@"response3: %@ error: %@", response, error);
    }];

}

这里有一点，因为response是id类型，相把它转换为int型，一开始我用了（int）response强转，效果虽然能达到，但是汇报警告。最后用了
[response intValue]就好了。

4.WKWebView的代理协议（WKNavigationDelegate，WKUIDelegate）
4.1 WKNavigationDelegate（主要的）

#pragma mark - WKNavigationDelegate
// 页面开始加载时调用
- (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 {

}
*/

如果想在加载的页面中继续操作
UIWebView打开一个页面之后，点击里面的内容就直接能跳转。而WKWebView一开始点里面的东西没反应，只要加了这个方法就好了。

// 在发送请求之前，决定是否跳转
- (void)webView:(WKWebView *)webView decidePolicyForNavigationAction:(WKNavigationAction *)navigationAction decisionHandler:(void (^)(WKNavigationActionPolicy))decisionHandler {
    if (navigationAction.targetFrame == nil) {
        [webView loadRequest:navigationAction.request];
    }
    decisionHandler(WKNavigationActionPolicyAllow);
}

4.2 WKUIDelegate

/*
 以下三个代理方法全都是与界面弹出提示框相关的，针对web界面的三种提示框（警告框，提示框，输入框）分别对应三种代理方法
 */

- (void)webView:(WKWebView *)webView runJavaScriptAlertPanelWithMessage:(NSString *)message initiatedByFrame:(WKFrameInfo *)frame completionHandler:(void (^)(void))completionHandler {
  NSLog(@"%s", __FUNCTION__);
  UIAlertController *alert = [UIAlertController alertControllerWithTitle:@"alert" message:@"JS调用alert" preferredStyle:UIAlertControllerStyleAlert];
  [alert addAction:[UIAlertAction actionWithTitle:@"确定" style:UIAlertActionStyleDefault handler:^(UIAlertAction * _Nonnull action) {
    completionHandler();
  }]];

  [self presentViewController:alert animated:YES completion:NULL];
  NSLog(@"%@", message);
}

- (void)webView:(WKWebView *)webView runJavaScriptConfirmPanelWithMessage:(NSString *)message initiatedByFrame:(WKFrameInfo *)frame completionHandler:(void (^)(BOOL result))completionHandler {
  NSLog(@"%s", __FUNCTION__);

  UIAlertController *alert = [UIAlertController alertControllerWithTitle:@"confirm" message:@"JS调用confirm" preferredStyle:UIAlertControllerStyleAlert];
  [alert addAction:[UIAlertAction actionWithTitle:@"确定" style:UIAlertActionStyleDefault handler:^(UIAlertAction * _Nonnull action) {
    completionHandler(YES);
  }]];
  [alert addAction:[UIAlertAction actionWithTitle:@"取消" style:UIAlertActionStyleCancel handler:^(UIAlertAction * _Nonnull action) {
    completionHandler(NO);
  }]];
  [self presentViewController:alert animated:YES completion:NULL];

  NSLog(@"%@", message);
}

- (void)webView:(WKWebView *)webView runJavaScriptTextInputPanelWithPrompt:(NSString *)prompt defaultText:(nullable NSString *)defaultText initiatedByFrame:(WKFrameInfo *)frame completionHandler:(void (^)(NSString * __nullable result))completionHandler {
  NSLog(@"%s", __FUNCTION__);

  NSLog(@"%@", prompt);
  UIAlertController *alert = [UIAlertController alertControllerWithTitle:@"textinput" message:@"JS调用输入框" preferredStyle:UIAlertControllerStyleAlert];
  [alert addTextFieldWithConfigurationHandler:^(UITextField * _Nonnull textField) {
    textField.textColor = [UIColor redColor];
  }];

  [alert addAction:[UIAlertAction actionWithTitle:@"确定" style:UIAlertActionStyleDefault handler:^(UIAlertAction * _Nonnull action) {
    completionHandler([[alert.textFields lastObject] text]);
  }]];

  [self presentViewController:alert animated:YES completion:NULL];
}

还有一些好用的属性，比如进度，前进，后退，这些都很简单，看下API就行了。