开发App的过程中,常常会遇到在App内部加载网页,通常用UIWebView加载。这个自iOS2开始使用的网页加载器一直是开发的心病:加载速度慢,占用内存多,优化困难。如果加载网页多,还可能因为过量占用内存而给系统kill掉。各种优化的方法效果也不那么明显(点击查看常用优化方法)。

iOS8以后,苹果推出了新框架Wekkit,提供了替换UIWebView的组件WKWebView。各种UIWebView的问题没有了,速度更快了,占用内存少了,一句话,WKWebView是App内部加载网页的最佳选择!

先看下 WKWebView的特性:

  1. 在性能、稳定性、功能方面有很大提升(最直观的体现就是加载网页是占用的内存,模拟器加载百度与开源中国网站时,WKWebView占用23M,而UIWebView占用85M);
  2. 允许JavaScript的Nitro库加载并使用(UIWebView中限制);
  3. 支持了更多的HTML5特性;
  4. 高达60fps的滚动刷新率以及内置手势;
  5. 将UIWebViewDelegate与UIWebView重构成了14类与3个协议(查看苹果官方文档);

然后从以下几个方面说下WKWebView的基本用法:

  1. 加载网页
  2. 加载的状态回调
  3. 新的WKUIDelegate协议
  4. 动态加载并运行JS代码
  5. webView 执行JS代码
  6. JS调用App注册过的方法

一、加载网页

加载网页或HTML代码的方式与UIWebView相同,代码示例如下:

 WKWebView *webView = [[WKWebView alloc] initWithFrame:self.view.bounds];
[webView loadRequest:[NSURLRequest requestWithURL:[NSURL URLWithString:@"http://www.baidu.com"]]];
[self.view addSubview:webView];

二、加载的状态回调 (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;

三、新的WKUIDelegate协议

这个协议主要用于WKWebView处理web界面的三种提示框(警告框、确认框、输入框),下面是警告框的例子:

/**
* web界面中有弹出警告框时调用
*
* @param webView 实现该代理的webview
* @param message 警告框中的内容
* @param frame 主窗口
* @param completionHandler 警告框消失调用
*/
- (void)webView:(WKWebView *)webView runJavaScriptAlertPanelWithMessage:(NSString *)message initiatedByFrame:(void (^)())completionHandler;

四、动态加载并运行JS代码

用于在客户端内部加入JS代码,并执行,示例如下:

// 图片缩放的js代码
NSString *js = @"var count = document.images.length;for (var i = 0; i < count; i++) {var image = document.images[i];image.style.width=320;};window.alert('找到' + count + '张图');";
// 根据JS字符串初始化WKUserScript对象
WKUserScript *script = [[WKUserScript alloc] initWithSource:js injectionTime:WKUserScriptInjectionTimeAtDocumentEnd forMainFrameOnly:YES];
// 根据生成的WKUserScript对象,初始化WKWebViewConfiguration
WKWebViewConfiguration *config = [[WKWebViewConfiguration alloc] init];
[config.userContentController addUserScript:script];
_webView = [[WKWebView alloc] initWithFrame:self.view.bounds configuration:config];
[_webView loadHTMLString:@"<head></head><imgea src='http://www.nsu.edu.cn/v/2014v3/img/background/3.jpg' />"baseURL:nil];
[self.view addSubview:_webView];

五、webView 执行JS代码

用户调用用JS写过的代码,一般指服务端开发的:

//javaScriptString是JS方法名,completionHandler是异步回调block
[self.webView evaluateJavaScript:javaScriptString completionHandler:completionHandler];

六、JS调用App注册过的方法

WKWebView里面注册供JS调用的方法,是通过WKUserContentController类下面的方法:

- (void)addScriptMessageHandler:(id <WKScriptMessageHandler>)scriptMessageHandler name:(NSString *)name;

scriptMessageHandler是代理回调,JS调用name方法后,OC会调用scriptMessageHandler指定的对象。

JS在调用OC注册方法的时候要用下面的方式:

window.webkit.messageHandlers.<name>.postMessage(<messageBody>)

注意,name(方法名)是放在中间的,messageBody只能是一个对象,如果要传多个值,需要封装成数组,或者字典。整个示例如下:

//OC注册供JS调用的方法
[[_webView configuration].userContentController addScriptMessageHandler:self name:@"closeMe"]; //OC在JS调用方法做的处理
- (void)userContentController:(WKUserContentController *)userContentController didReceiveScriptMessage:(WKScriptMessage *)message
{
NSLog(@"JS 调用了 %@ 方法,传回参数 %@",message.name,message.body);
} //JS调用
window.webkit.messageHandlers.closeMe.postMessage(null);

如果你在selfdealloc打个断点,会发现self没有释放!这显然是不行的!谷歌后看到一种解决方法,如下:

@interface WeakScriptMessageDelegate : NSObject<WKScriptMessageHandler>

@property (nonatomic, weak) id<WKScriptMessageHandler> scriptDelegate;

- (instancetype)initWithDelegate:(id<WKScriptMessageHandler>)scriptDelegate;

@end

@implementation WeakScriptMessageDelegate

- (instancetype)initWithDelegate:(id<WKScriptMessageHandler>)scriptDelegate
{
self = [super init];
if (self) {
_scriptDelegate = scriptDelegate;
}
return self;
} - (void)userContentController:(WKUserContentController *)userContentController didReceiveScriptMessage:(WKScriptMessage *)message
{
[self.scriptDelegate userContentController:userContentController didReceiveScriptMessage:message];
} @end

思路是另外创建一个代理对象,然后通过代理对象回调指定的self

WKUserContentController *userContentController = [[WKUserContentController alloc] init];
[userContentController addScriptMessageHandler:[[WeakScriptMessageDelegate alloc] initWithDelegate:self] name:@"closeMe"];

运行代码,self释放了,WeakScriptMessageDelegate却没有释放啊啊啊!
还需在selfdealloc里面 添加这样一句代码:

[[_webView configuration].userContentController removeScriptMessageHandlerForName:@"closeMe"];

OK,圆满解决问题!

目前,大多数App需要支持iOS7以上的版本,而WKWebView只在iOS8后才能用,所以需要一个兼容性方案,既iOS7下用UIWebView,iOS8后用WKWebView。这个库提供了这种兼容性方案:https://github.com/wangyangcc/IMYWebView

以上部分内容参考自:http://www.brighttj.com/ios/ios-wkwebview-new-features-and-use.html

原文链接:http://www.jianshu.com/p/6ba2507445e4

 

使用WKWebView替换UIWebView的更多相关文章

  1. iOS项目之WKWebView替换UIWebView相关

    在网上已经有了许多关于UIWebView替换为WKWebView的文章,所以在这里就不在多说替换的细节了,不会的可以在网上搜搜. 下面是我在项目中遇到的问题: 问题一:在UIWebView中,网页显示 ...

  2. iOS开发之WKWebView代替UIWebView

    前言 Xcode8发布以后,编译器开始不支持IOS7,所以很多应用在适配IOS10之后都不在适配IOS7了,其中包括了很多大公司,网易新闻,滴滴出行等.因此,我们公司的应用也打算淘汰IOS7. 支持到 ...

  3. swift - UIWebView 和 WKWebView(iOS12 之后替换UIWebView)

    1.iOS12 之前 使用 UIWebView 1> private lazy var webV : UIWebView = { let v = UIWebView(frame: self.vi ...

  4. DTCoreText 、WKWebView 、UIWebView的比较

    DTCoreText .WKWebView .UIWebView的比较 HTML->View 数据解析: WebCore:排版引擎核心,WebCore包含主要以下模块:Loader, Parse ...

  5. IOS Html富文本渲染方式:DTCoreText、WKWebView、UIWebView的内存占用对比

    在app的内容页(详情页)中,富文本的显示一直是经常需要处理的问题,而通常在后端的富文本编辑中,Html应用比较普遍,所以其实需要处理的Html富文本显示的问题,以下这三种方式肯定不是最优的显示Htm ...

  6. WKWebView比UIWebView优越性

    1.在使用两者的过程中发现前者比后者节省内存一倍多,WKWebView 是苹果在 iOS 8 中引入的新组件,目的是给出一个新的高性能的 Web View 解决方案,摆脱过去 UIWebView 的老 ...

  7. WKWebView 与 UIWebView

    apple和google为webkit该浏览器引擎的发扬光大做出了重要贡献,在WWDC 2014发布会上发布iOS 8中,apple公布了WebKit框架,这意味着OSX和IOS开发者将共用同样的开发 ...

  8. iOS开发之Xcode8推出的WKWebView与UIWebView的使用

    一.整体介绍 UIWebView自iOS2就有,WKWebView从iOS8才有,毫无疑问WKWebView将逐步取代笨重的UIWebView.通过简单的测试即可发现UIWebView占用过多内存,且 ...

  9. 有关wkwebview和UIwebview获取html中的标签方法

    wkwebview方法如下: [webView evaluateJavaScript:@"navigator.userAgent" completionHandler:^(id r ...

随机推荐

  1. mybaties # , $

    mybaties会对#引入的值加上双引号, 如: #{buildingName} -------->"buildingName";mybaties会将$引入的值直接显示到sq ...

  2. 【Solr】数据库数据导入索引库

    目录 分析框图 配置数据库与solrconfig.xml 回到顶部 分析框图 框图画的粗糙!勿喷啊!勿喷啊! 回到顶部 配置数据库与solrconfig.xml Dataimport插件 可以批量把数 ...

  3. 不挣扎了,开始学习LINQ TO XML,进而来解析网页。

    找到了别人遇到和我一样的问题:http://ylad.codeplex.com/discussions/430095(英文) 一位叫做Mister Goodcat的提供了信息: Short answe ...

  4. Ubuntu 12 编译安装 PHP 5.4 及 问题汇总

    参考先前的文章:Ubuntu 14 编译安装 PHP 5.4.45 + Nginx 1.4.7 + MySQL 5.6.26 笔记 安装过程: ############################ ...

  5. 关于Dijkstra最短路径算法

    Dijkstra算法,不是很明白,今天找了一些博客看了一下,决定自己也写一个为以后忘记的时候可以看做准备. 实际上,如果理解没错的话,该算法实际上和枚举法有点像,只不过,在选取出发路径的路径都是最短路 ...

  6. window使用qt遇到的坑

    1.window上的qt对图片的检测与识别不够完善.往往改了一个ui的背景图片,运行出来显示的却是旧的背景图片. 原因:  由于之前是项目与项目之间整合在一起,然后把ui_*_ui.h的临时文件也放在 ...

  7. ios工程中加入.c/.cpp文件

    如果你在工程里拉入.c/.cpp文件就会导致工程报错, 现在有两种解决方式 1. 把.c文件的后缀全部改成.m的后缀 把.cpp文件的后缀改成.mm的后缀 2. 使用 工程名-Prefix.pch 并 ...

  8. python 集合 -----直接用逗号连接的是元组,不是list

    t = 12345, 54321, 'hello!' >>> t[0] 12345 >>> t (12345, 54321, 'hello!') 元组:元组由逗号分 ...

  9. [POJ2892]Tunnel Warfare

    [POJ2892]Tunnel Warfare 试题描述 During the War of Resistance Against Japan, tunnel warfare was carried ...

  10. 编写Delphi控件属性Stored和Default的理解及应用

    property ButtonSize: Integer read FButtonSize write SetButtonSize default 0;    property Color: TCol ...