当前位置: 开发笔记 > 编程语言 > 正文

WKWebView的使用（iOS8.0及以上版本使用）替代UIWebView

作者：惰堂_301 | 来源：互联网 | 2023-09-07 14:39

Demo实例在iOS开发中，调用web页面时，最常用的就是UIWebView控件。但在使用过程中，也让大家觉得很不爽，就是内存爆增。自从iOS8.0以后有了WKWebView，这种情

Demo实例

在iOS开发中，调用web页面时，最常用的就是

UIWebView控件。但在使用过程中，也让大家觉得很不爽，就是内存爆增。

自从iOS8.0以后有了WKWebView，这种情况就好转了。因为在使用WKWebView的过程中基本上内存保持不变。

WKWebView 是现代 WebKit API在 iOS 8和 OS X Yosemite应用中的核心部分。

WKWebView 代替了 UIKit中的 UIWebView和 AppKit中的 WebView，提供了统一的跨双平台 API。

WKWebView的特点：

1 拥有 60fps滚动刷新率

2 内置手势

3 高效的 app和 web信息交换通道

4 和 Safari相同的 Javascript引擎

5 性能高，稳定性好，占用的内存比较小

下面两图分别是使用WKWebView、UIWebView时的内存情况

WKWebView怎么使用呢？话不多说，直接上码。

1、导入头文件

#if __IPHONE_OS_VERSION_MAX_ALLOWED >= __IPHONE_8_0
#import 
#endif

2、添加协议及定义 WKWebView

在这里我定义成属性使用，同时使用getter方法进行实例化，实例化后记得要添加到父视图。

@interface WKWebViewVC () 

@property (nonatomic, strong) WKWebView *webview;

@end

- (WKWebView *)webview{    if (_webview == nil)    {        _webview = [[WKWebView alloc] init];        _webview.frame = self.view.bounds;        _webview.backgroundColor = [UIColor clearColor];                _webview.UIDelegate = self;        _webview.navigatiOnDelegate= self;            }        return _webview;}

[self.view addSubview:self.webview];

3、实现代理方法

3-1、WKUIDelegate代理方法

UI界面相关，原生控件支持，三种提示框：输入、确认、警告。首先将web提示框拦截然后再做处理

/// 创建一个新的WebView
- (WKWebView *)webView:(WKWebView *)webView createWebViewWithConfiguration:(WKWebViewConfiguration *)configuration forNavigationAction:(WKNavigationAction *)navigationAction windowFeatures:(WKWindowFeatures *)windowFeatures
{
    NSLog(@"加载：打开内部链接");
    
    // 打开内部链接
    return self.webview;
    
    // 不打开
//    return nil;
}

/// 输入框- (void)webView:(WKWebView *)webView runJavascriptTextInputPanelWithPrompt:(NSString *)prompt defaultText:(nullable NSString *)defaultText initiatedByFrame:(WKFrameInfo *)frame completionHandler:(void (^)(NSString * __nullable result))completionHandler{    NSLog(@"加载：输入框提示");        completionHandler(@"Client Not handler");}

/// 确认框- (void)webView:(WKWebView *)webView runJavascriptConfirmPanelWithMessage:(NSString *)message initiatedByFrame:(WKFrameInfo *)frame completionHandler:(void (^)(BOOL result))completionHandler{    NSLog(@"加载：确认框提示");        //  js 里面的alert实现，如果不实现，网页的alert函数无效    UIAlertController *alertCOntroller= [UIAlertController alertControllerWithTitle:message                                                                             message:nil                                                                      preferredStyle:UIAlertControllerStyleAlert];    [alertController addAction:[UIAlertAction actionWithTitle:@"确定"                                                        style:UIAlertActionStyleDefault                                                      handler:^(UIAlertAction *action) {                                                          completionHandler(YES);                                                      }]];    [alertController addAction:[UIAlertAction actionWithTitle:@"取消"                                                        style:UIAlertActionStyleCancel                                                      handler:^(UIAlertAction *action){                                                          completionHandler(NO);                                                      }]];        [self presentViewController:alertController animated:YES completion:^{}];}

/// 警告框- (void)webView:(WKWebView *)webView runJavascriptAlertPanelWithMessage:(NSString *)message initiatedByFrame:(WKFrameInfo *)frame completionHandler:(void (^)(void))completionHandler{    NSLog(@"加载：警告框提示");        // js 里面的alert实现，如果不实现，网页的alert函数无效    UIAlertController *alertCOntroller= [UIAlertController alertControllerWithTitle:message                                                                             message:nil                                                                      preferredStyle:UIAlertControllerStyleAlert];    [alertController addAction:[UIAlertAction actionWithTitle:@"确定"                                                        style:UIAlertActionStyleCancel                                                      handler:^(UIAlertAction *action) {                                                          completionHandler();                                                      }]];        [self presentViewController:alertController animated:YES completion:^{}];}

3-2、WKNavigationDelegate

追踪加载过程，有是否允许加载、开始加载、加载完成、加载失败

/// 接收到服务器跳转请求之后调用 (服务器端redirect)，不一定调用
- (void)webView:(WKWebView *)webView didReceiveServerRedirectForProvisionalNavigation:(WKNavigation *)navigation
{
    [UIApplication sharedApplication].networkActivityIndicatorVisible = NO ;
    
    NSLog(@"加载：服务器跳转");
}

/// 1 在发送请求之前，决定是否跳转（注：不加上decisionHandler回调会造成闪退）
- (void)webView:(WKWebView *)webView decidePolicyForNavigationAction:(WKNavigationAction *)navigationAction decisionHandler:(void (^)(WKNavigationActionPolicy))decisionHandler
{
    [UIApplication sharedApplication].networkActivityIndicatorVisible = YES ;
    
    NSLog(@"加载：发送请求是否跳转");

    
    WKNavigationActionPolicy actiOnPolicy= WKNavigationActionPolicyAllow;
    // 这句是必须加上的，不然会异常
    decisionHandler(actionPolicy);
}

/// 2 页面开始加载
- (void)webView:(WKWebView *)webView didStartProvisionalNavigation:(WKNavigation *)navigation
{
    [UIApplication sharedApplication].networkActivityIndicatorVisible = YES ;
    
    NSLog(@"加载：开始");
}

/// 3 在收到服务器的响应头，根据response相关信息，决定是否跳转。decisionHandler必须调用，来决定是否跳转，参数WKNavigationActionPolicyCancel取消跳转，WKNavigationActionPolicyAllow允许跳转（注：不加上decisionHandler回调会造成闪退）- (void)webView:(WKWebView *)webView decidePolicyForNavigationResponse:(WKNavigationResponse *)navigationResponse decisionHandler:(void (^)(WKNavigationResponsePolicy))decisionHandler{    NSLog(@"加载：服务器响应头");        WKNavigationResponsePolicy respOnsePolicy= WKNavigationResponsePolicyAllow;    // 这句是必须加上的，不然会异常    decisionHandler(responsePolicy);}

/// 4 开始获取到网页内容时返回
- (void)webView:(WKWebView *)webView didCommitNavigation:(WKNavigation *)navigation
{
    [UIApplication sharedApplication].networkActivityIndicatorVisible = YES ;
    
    NSLog(@"加载：开始获取信息");
}

/// 5 页面加载完成之后调用- (void)webView:(WKWebView *)webView didFinishNavigation:(WKNavigation *)navigation{    [UIApplication sharedApplication].networkActivityIndicatorVisible = NO ;        NSLog(@"加载：完成");}

/// 页面加载失败时调用- (void)webView:(WKWebView *)webView didFailProvisionalNavigation:(WKNavigation *)navigation{    [UIApplication sharedApplication].networkActivityIndicatorVisible = NO ;        NSLog(@"加载：失败");}

4、打开web页面，或停止加载web页面

- (void)startClick
{
    if ([_webview isLoading])
    {
        return;
    }
    
    NSURL *url = [NSURL URLWithString:@"http://www.hao123.com"];
    NSURLRequest *request = [NSURLRequest requestWithURL:url];
    [_webview loadRequest:request];
    
    NSLog(@"加载：启动");
}

- (void)stopClick{    if ([_webview isLoading])    {        [_webview stopLoading];                [UIApplication sharedApplication].networkActivityIndicatorVisible = NO;                NSLog(@"加载：停止");    }}

注意：

1、视图控制器释放时，注意内存管理。

- (void)dealloc
{
    _webview.UIDelegate = nil;
    _webview.navigatiOnDelegate= nil;
    [_webview loadHTMLString:@"" baseURL:nil];
    [_webview stopLoading];
    [_webview removeFromSuperview];
    [[NSURLCache sharedURLCache] removeAllCachedResponses];
    [UIApplication sharedApplication].networkActivityIndicatorVisible = NO;
    
    _webview = nil;
}

2、WKWebView有个监视加载进度的属性"estimatedProgress"

注意：kvo使用时path名称必须是"estimatedProgress"，或者"NSStringFromSelector(@selector(estimatedProgress))
"，否则会造成异常闪退。

#pragma mark - 通知方法

- (void)observeProgress
{
    // 进度条监视
    CGFloat progress = self.webview.estimatedProgress;
    NSLog(@"加载进度：%.2f", progress);
    
    [self.webview addObserver:self forKeyPath:@"estimatedProgress" options:NSKeyValueObservingOptionNew context:nil];
}

- (void)observeValueForKeyPath:(NSString *)keyPath ofObject:(id)object change:(NSDictionary *)change context:(void *)context
{
    // 进度条
    if ([@"estimatedProgress" isEqualToString:keyPath])
    {
        CGFloat progress = self.webview.estimatedProgress;
        NSLog(@"正在加载中，加载进度：%.2f", progress);
     
        // 初始和终止状态
        if (progress == 0.0)
        {
            NSLog(@"加载开始，进度条值：0.0");
        }
        else if (progress == 1.0)
        {
            NSLog(@"加载结束，进度条值：1.0");
            
            // 1秒后隐藏
            dispatch_after(dispatch_time(DISPATCH_TIME_NOW, (int64_t)(1 * NSEC_PER_SEC)), dispatch_get_main_queue(), ^{
                // 再次判断，防止正在加载时有其他操作
                if (progress == 1.0)
                {
                    NSLog(@"加载结束，进度条值：1.0（异步）");
                }
            });
        }
    }
}

2016-09-30 17:10:47.121 DemoWebViewOptimize[16698:308353] 加载进度：0.002016-09-30 17:10:48.148 DemoWebViewOptimize[16698:308353] 正在加载中，加载进度：0.102016-09-30 17:10:48.148 DemoWebViewOptimize[16698:308353] 加载：启动2016-09-30 17:10:48.160 DemoWebViewOptimize[16698:308353] 加载：发送请求是否跳转2016-09-30 17:10:48.170 DemoWebViewOptimize[16698:308353] 加载：开始2016-09-30 17:10:48.273 DemoWebViewOptimize[16698:308353] 加载：发送请求是否跳转2016-09-30 17:10:48.274 DemoWebViewOptimize[16698:308353] 加载：服务器跳转2016-09-30 17:10:48.326 DemoWebViewOptimize[16698:308353] 加载：发送请求是否跳转2016-09-30 17:10:48.327 DemoWebViewOptimize[16698:308353] 加载：服务器跳转2016-09-30 17:10:48.468 DemoWebViewOptimize[16698:308353] 加载：服务器响应头2016-09-30 17:10:48.469 DemoWebViewOptimize[16698:308353] 正在加载中，加载进度：0.302016-09-30 17:10:48.527 DemoWebViewOptimize[16698:308353] 加载：开始获取信息2016-09-30 17:10:48.635 DemoWebViewOptimize[16698:308353] 加载：发送请求是否跳转2016-09-30 17:10:48.692 DemoWebViewOptimize[16698:308353] 正在加载中，加载进度：0.852016-09-30 17:10:48.713 DemoWebViewOptimize[16698:308353] 加载：服务器响应头2016-09-30 17:10:48.923 DemoWebViewOptimize[16698:308353] 正在加载中，加载进度：0.902016-09-30 17:10:48.989 DemoWebViewOptimize[16698:308353] 加载：发送请求是否跳转2016-09-30 17:10:48.991 DemoWebViewOptimize[16698:308353] 加载：服务器响应头2016-09-30 17:10:49.008 DemoWebViewOptimize[16698:308353] 加载：发送请求是否跳转2016-09-30 17:10:49.188 DemoWebViewOptimize[16698:308353] 正在加载中，加载进度：0.902016-09-30 17:10:49.197 DemoWebViewOptimize[16698:308353] 加载：服务器响应头2016-09-30 17:10:49.198 DemoWebViewOptimize[16698:308353] 正在加载中，加载进度：1.002016-09-30 17:10:49.199 DemoWebViewOptimize[16698:308353] 加载结束，进度条值：1.02016-09-30 17:10:49.199 DemoWebViewOptimize[16698:308353] 加载：完成2016-09-30 17:10:49.328 DemoWebViewOptimize[16698:308353] 加载：发送请求是否跳转2016-09-30 17:10:49.384 DemoWebViewOptimize[16698:308353] 加载：服务器响应头2016-09-30 17:10:49.855 DemoWebViewOptimize[16698:308353] 加载：发送请求是否跳转2016-09-30 17:10:49.900 DemoWebViewOptimize[16698:308353] 加载：服务器响应头2016-09-30 17:10:50.293 DemoWebViewOptimize[16698:308353] 加载结束，进度条值：1.0（异步）

注意：

代理方法使用说明

// 1 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;

// 2 WKNavigtionDelegate来进行页面跳转
// 接收到服务器跳转请求之后再执行
- (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;

// 3  WKUIDelegate(PS:WKUIDelegate主要是做跟网页交互的，可以显示Javascript的一些alert或者Action，看起来跟自己做的一样的.)
// 创建一个新的WebVeiw
- (nullable WKWebView *)webView:(WKWebView *)webView createWebViewWithConfiguration:(WKWebViewConfiguration *)configuration forNavigationAction:(WKNavigationAction *)navigationAction windowFeatures:(WKWindowFeatures *)windowFeatures;
// WebVeiw关闭（9.0中的新方法）
- (void)webViewDidClose:(WKWebView *)webView NS_AVAILABLE(10_11, 9_0);
// 显示一个JS的Alert（与JS交互）
- (void)webView:(WKWebView *)webView runJavascriptAlertPanelWithMessage:(NSString *)message initiatedByFrame:(WKFrameInfo *)frame completionHandler:(void (^)(void))completionHandler;
// 弹出一个输入框（与JS交互的）
- (void)webView:(WKWebView *)webView runJavascriptTextInputPanelWithPrompt:(NSString *)prompt defaultText:(nullable NSString *)defaultText initiatedByFrame:(WKFrameInfo *)frame completionHandler:(void (^)(NSString * __nullable result))completionHandler;
// 显示一个确认框（JS的）
- (void)webView:(WKWebView *)webView runJavascriptConfirmPanelWithMessage:(NSString *)message initiatedByFrame:(WKFrameInfo *)frame completionHandler:(void (^)(BOOL result))completionHandler;

推荐阅读

safari
创建ipadWEB应用程序到主屏幕

1.webkit内核中的一些私有的meta标签，这些meta标签在开发webapp时起到非常重要的作用(1) ... [详细]

蜡笔小新 2023-10-17 11:02:41
char
pyecharts 介绍

一、pyecharts介绍ECharts，一个使用JavaScript实现的开源可视化库，可以流畅的运行在PC和移动设备上，兼容当前绝大部 ... [详细]

蜡笔小新 2023-10-16 08:29:03
char
通知提示Html5 Notification

一、Notification通知是属于桌面性质的通知，在显示器的右下角蹦出二、兼容性IE14以及其他桌面浏览器都支持WebNotification，目前 ... [详细]

蜡笔小新 2023-10-14 19:55:15
default
vue 地图使用navigator_weex踩坑之旅第五弹 ~ 使用navigator内置模块实现导航

目前，我个人认为在weex中实现页面跳转的方式有两种，一种是通过weex提供的navigator模块，一种是通过vue-router之类的 ... [详细]

蜡笔小新 2023-10-14 11:30:27
default
移动端Web开发的实用技巧与经验分享

META相关1.添加到主屏后的标题（IOS）&amp;lt;metaname&quot;apple-mobile-web-app-title& ... [详细]

蜡笔小新 2023-10-13 15:19:46
default
Android Studio Bumblebee | 2021.1.1（大黄蜂版本使用介绍）

本文介绍了Android Studio Bumblebee | 2021.1.1（大黄蜂版本）的使用方法和相关知识，包括Gradle的介绍、设备管理器的配置、无线调试、新版本问题等内容。同时还提供了更新版本的下载地址和启动页面截图。 ... [详细]

蜡笔小新 2023-12-14 10:34:15
default
20211101CleverTap参与度和分析工具功能平台学习/实践

1.应用场景主要用于学习CleverTap的使用,该平台主要用于客户保留与参与平台.为客户提供价值.这里接触到的原因,是目前公司用到该平台的服务~2.学习操作 ... [详细]

蜡笔小新 2023-12-14 10:25:12
default
安卓select模态框样式改变_微软Office风格的多端（Web、安卓、iOS）组件库——Fabric UI...

介绍FabricUI是微软开源的一套Office风格的多端组件库，共有三套针对性的组件，分别适用于web、android以及iOS，Fab ... [详细]

蜡笔小新 2023-12-14 05:55:08
default
Voicewo在线语音识别转换jQuery插件的特点和示例

本文介绍了一款名为Voicewo的在线语音识别转换jQuery插件，该插件具有快速、架构、风格、扩展和兼容等特点，适合在互联网应用中使用。同时还提供了一个快速示例供开发人员参考。 ... [详细]

蜡笔小新 2023-12-13 20:01:16
default
如何在服务器主机上实现文件共享的方法和工具

本文介绍了在服务器主机上实现文件共享的方法和工具，包括Linux主机和Windows主机的文件传输方式，Web运维和FTP/SFTP客户端运维两种方式，以及使用WinSCP工具将文件上传至Linux云服务器的操作方法。此外，还介绍了在迁移过程中需要安装迁移Agent并输入目的端服务器所在华为云的AK/SK，以及主机迁移服务会收集的源端服务器信息。 ... [详细]

蜡笔小新 2023-12-13 13:23:48
default
CSS背景位置y | backgroundpositiony

css,背景,位置,y,background, ... [详细]

蜡笔小新 2023-10-16 16:28:38
default
iOS 10新特性汇总，期盼已久的骚扰电话拦截功能来了

今天凌晨开始苹果正式开始了iOS10的推送工作，使用iPhone和iPad的用户可 ... [详细]

蜡笔小新 2023-10-15 18:58:26
default
iOS 12 beta8如何更新？ iOS 12 beta8更新方法攻略介绍！

iOS12beta8小伙伴们可以进行更新升级了，这次更新主要是为了解决之前出现的问题，不少小伙伴们比较好奇的就是该怎么更新，想知道更新方法的就一起来看看吧。更新方法介绍OS12兼容 ... [详细]

蜡笔小新 2023-10-15 17:33:18
default
axure 动态面板自动适应浏览器宽度_Axure技能：自适应移动设备屏幕大小（进阶教程）...

《Axure新技能：自适应手机屏幕大小》相信不少人都已经看过，并对设置方法已经很熟悉了，但该教程只能适应iphone6的屏幕尺寸的比例&# ... [详细]

蜡笔小新 2023-10-15 15:56:01
default
Signing Identities, Missing Private Key, Cannot sign App

这个问题发生在重新安装系统后，丢失了之前的privatekey等。所以解决方法就是提示的revokeandrequest。到developercenter中找到certificat ... [详细]

蜡笔小新 2023-10-15 12:07:56

惰堂_301

这个家伙很懒，什么也没留下！

Tags | 热门标签

RankList | 热门文章