zoukankan      html  css  js  c++  java
  • iOS WKWebView详解

    UIWebView就不用说了,这个过时了,现在iOS8以后建议都使用WKWebView。

    WKWebView 是现代 WebKit API 在 iOS 8 和 OS X Yosemite 应用中的核心部分。它代替了 UIKit 中的UIWebView 和 AppKit 中的 WebView,提供了统一的跨双平台 API。

    自诩拥有 60fps 滚动刷新率、内置手势、高效的 app 和 web 信息交换通道、和 Safari 相同的 JavaScript 引擎,WKWebView 毫无疑问地成为了 WWDC 2014 上的最亮点。

    【UIWebView 和 WKWebView 的区别】
    WKWebView 更快(占用内存可能只有 UIWebView 的1/3~1/4),没有缓存,更为细致地拆分了 UIWebViewDelegate 中的方法。

    【为什么现在是时候从 UIWebView 迁移到 WKWebView 了】
    截止到我写这篇文章的时候,据 mixpanel 的数据,iOS 9 占有率已达 58.55%,iOS 8 占有率达到了 34.78%,iOS 7 及更早版本是 6.66%,而那 6.66% 应该大部分都是对手机使用极度不频繁的人。所以从现在开始,再开发 App 只兼容 iOS 8 和 iOS 9 两个版本就可以了(如果你的产品对覆盖率要求不是很苛刻的话)。WKWebView 是 iOS 8 之后才有的 WebKit 中的内容,所以之前我们要同时兼容 iOS 7 和 iOS 8 的时候,可以推辞说 UIWebView 和 WKWebView 一起做太麻烦了,现在可没有理由拒绝新东西了。

    目前iOS各个版本市场使用率参见:https://developer.apple.com/support/app-store/

    [常用代理方法]

    在 WKWebView 中,UIWebViewDelegate 与 UIWebView 被重构成了14类与3个协议,下面给出一些在 UIWebView 中常用的方法的 WKWebView 版本。

    //准备加载页面
    UIWebViewDelegate - webView:shouldStartLoadWithRequest:navigationType
    WKNavigationDelegate - webView:didStartProvisionalNavigation:
     
    
    //已开始加载页面,可以在这一步向view中添加一个过渡动画
    UIWebViewDelegate - webViewDidStartLoad:
    WKNavigationDelegate - webView:didCommitNavigation:
     
    
    //页面已全部加载,可以在这一步把过渡动画去掉
    UIWebViewDelegate - webViewDidFinishLoad:
    WKNavigationDelegate - webView:didFinishNavigation:
     
    
    //加载页面失败
    UIWebViewDelegate - webView:didFailLoadWithError:
    WKNavigationDelegate - webView:didFailNavigation:withError:
    WKNavigationDelegate - webView:didFailProvisionalNavigation:withError:
    

      

    以上方法分别存在于 UIWebViewDelegate 和 WKNavigationDelegate 中。
    如果你之前只是用到了以上列出的 UIWebViewDelegate 中的几个方法,那么只是简单地换一个方法名,让你的 ViewController 继承 WKNavigationDelegate ,继续用就可以了。想要更多内容可以自己用 cmd键+鼠标左击『WKNavigationDelegate』通过 Xcode 查看。
    要注意的是 webview.delegate = self 需要改写为 webview.navigationDelegate = self

    JS交互

    在 UIWebView 中,一句简单的webView.stringByEvaluatingJavaScriptFromString() 就可以用 JS 脚本操纵 WebView,在 WKWebView 中,我们可能需要用到 WKScriptMessageHandler 这个协议中的 func userContentController(userContentController: WKUserContentController, didReceiveScriptMessage message: WKScriptMessage) 方法。

    下面的示例代码用于从 WKWebView 中获取网页中的文本。

    let js = "window.webkit.messageHandlers.observe.postMessage(document.body.innerText);" // 注意这里的observe字段是自己写的,不是固定的写法,参考第6行
        let script = WKUserScript(source: js, injectionTime: WKUserScriptInjectionTime.AtDocumentEnd, forMainFrameOnly: true) // 这里的 AtDocumentEnd 字段是指网页中的内容加载完毕后再插入 JS 脚本,你也可以选择 AtDocumentStart,在 document element 刚刚创建时就插入脚本,看具体需求
        let config = WKWebViewConfiguration()
        config.userContentController.addUserScript(script)
        config.userContentController.addScriptMessageHandler(self, name: "observe") // 对应第一行 JS 脚本中的observe字段
        //初始化WKWebView
        let webview = WKWebView(
            frame: CGRectMake(0, 0, self.view.frame.width, self.view.frame.height),
            configuration: config)
        webview.navigationDelegate = self
        self.view.addSubview(webview)
        //加载网页
        webview.loadRequest(NSURLRequest(URL: NSURL(string: "http://www.jianshu.com")!))
    

      


    可能你也注意到了,把 JS 脚本注入到 WebView 的途径是初始化一个 WebView,所以你需要在 WebView 初始化之前写好自己的脚本。当然如果你不需要 JS 交互,直接用一个 frame 来初始化 WebView,去掉 configuration 参数就好了。

    然而,我们如何拿到从 WKWebView 中抓取到的文本呢(通过 document.body.innerText 这一句)?
    如上面所说,让你的 ViewController 在继承了 WKNavigationDelegate 之后再继承一下 WKScriptMessageHandler 。然后实现 WKScriptMessageHandler 中唯一的一个方法:

    func userContentController(userContentController: WKUserContentController, didReceiveScriptMessage message: WKScriptMessage){
        let str:NSString = message.body as! NSString // 因为我们抓取到的是文本,这里把 message.body 强制转换为 NSString,如果你通过 JS 拿到的是其他信息,按需转换
        print(str)
    }
    

      

    乍一看这里可能会有疑惑:我们给 WKWebView 绑定了 WKNavigationDelegate,但是 WKScriptMessageHandler 并没有提供代理方法啊。其实与此相对应的过程出现在上一段代码中的第5行:config.userContentController.addScriptMessageHandler 这一句。

     删除缓存

    iOS开发, 混编成为一种趋势。在中国,用户量较大的几个代表性app,淘宝,微信,支付宝,京东等,无不采用H5与 native混编模式。H5与native的交互变得越来越频繁,从而出现的问题也越来越多,下面我们一起讨论关于WKWebView的缓存问题。

    场景:

    当我们的APP已经开发完成,上传appstore以后,H5更新将不再受appstore得限制,可以随时去做更改。但WKWebView 有默认的缓存功能,即便H5做了更改,app上显示的依旧是老得页面。为了解决这一问题,我们就会用到WKWebView的删除 缓存功能。

    iOS9 WKWebView新方法:

    NSSet *websiteDataTypes = [NSSet setWithArray:@[
                            WKWebsiteDataTypeDiskCache,
                            WKWebsiteDataTypeOfflineWebApplicationCache,
                            WKWebsiteDataTypeMemoryCache,
                            WKWebsiteDataTypeLocalStorage,
                            WKWebsiteDataTypeCookies,
                            WKWebsiteDataTypeSessionStorage,
                            WKWebsiteDataTypeIndexedDBDatabases,
                            WKWebsiteDataTypeWebSQLDatabases
                        ]];
    //你可以选择性的删除一些你需要删除的文件 or 也可以直接全部删除所有缓存的type  
    //NSSet *websiteDataTypes = [WKWebsiteDataStore allWebsiteDataTypes];
    NSDate *dateFrom = [NSDate dateWithTimeIntervalSince1970:0];
    [[WKWebsiteDataStore defaultDataStore] removeDataOfTypes:websiteDataTypes   
    modifiedSince:dateFrom completionHandler:^{
           // code
        }];

    但开发app必须要兼容所有iOS版本,可是iOS8,iOS7没有这种直接的方法,那该怎么办呢? (iOS7.0只有UIWebView, 而iOS8.0是有WKWebView, 但8.0的WKWebView没有删除缓存方法。) 针对与iOS7.0、iOS8.0、iOS9.0 WebView的缓存,我们找到了一个通吃的办法:

    NSString *libraryDir = NSSearchPathForDirectoriesInDomains(NSLibraryDirectory,   
    NSUserDomainMask, YES)[0];
    NSString *bundleId  =  [[[NSBundle mainBundle] infoDictionary]   
    objectForKey:@"CFBundleIdentifier"];
    NSString *webkitFolderInLib = [NSString stringWithFormat:@"%@/WebKit",libraryDir];
    NSString *webKitFolderInCaches = [NSString   
    stringWithFormat:@"%@/Caches/%@/WebKit",libraryDir,bundleId];
     NSString *webKitFolderInCachesfs = [NSString   
     stringWithFormat:@"%@/Caches/%@/fsCachedData",libraryDir,bundleId];
    
    NSError *error;
    /* iOS8.0 WebView Cache的存放路径 */
    [[NSFileManager defaultManager] removeItemAtPath:webKitFolderInCaches error:&error];
    [[NSFileManager defaultManager] removeItemAtPath:webkitFolderInLib error:nil];
    
    /* iOS7.0 WebView Cache的存放路径 */
    [[NSFileManager defaultManager] removeItemAtPath:webKitFolderInCachesfs error:&error];

    H5更新发版的的时候,做一次清除WebView缓存, app的WebView就会显示最新的H5页面了。

     


    参考和转自文献:
  • 相关阅读:
    [NOI2018]归程 kruskal重构树
    [NOIP2017]逛公园 最短路图 拓扑序DP
    [bzoj4398] 福慧双修 最短路 二进制分组
    【HDOJ】【4405】Aeroplane chess飞行棋
    【ZOJ】【3329】One Person Game
    【POJ】【2096】Collecting Bugs
    【BZOJ】【3093】【FDU校赛2012】A Famous Game
    【BZOJ】【3143】【HNOI2013】游走
    【UVA】【10828】随机程序
    【UVA】【11762】Race to 1(得到1)
  • 原文地址:https://www.cnblogs.com/xiaopin/p/5856668.html
Copyright © 2011-2022 走看看