美文网首页
WKWebView的简介和使用

WKWebView的简介和使用

作者: 夏天的风_song | 来源:发表于2017-11-30 14:04 被阅读0次

    翻译文章 WKWeb​View

    前言

    史蒂夫·乔布斯的WWDC 2007主题演讲:

    Iphone内部有一套完整的Safari引擎。因此,您可以编写令人惊叹的Web2.0和Ajex应用程序,其外观与iPhone会上的应用程序完全相同。而这些应用程序可以完美地与iPhone服务集成。他们可以拨打电话,发送电子邮件,他们可以在Google地图上查找位置。

    网络一直是iOS上的二等公民(这很具有讽刺意味,因为iPhone主要负责今天的移动网络)。UIWebView是巨大而笨重的,并且存在泄漏内存。它滞后于有Nitro JavaScript 引擎的移动Safari。

    然而,随着WebKit框架和WKWebView的引入,所有这一切都发生了变化。

    WKWebView是iOS 8和OS X Yosemite中引入的现代WebKit API的核心。它取代了UIKit 的UIWebView和AppKit 的WebView,在两个平台上提供了一致的API。

    拥有响应60fps滚动,内置手势,简化应用程序和网页之间的通信,以及与Safari相同的JavaScript引擎,WKWebView是WWDC 2014最重要的发布之一。

    在UIWebView&UIWebViewDelegate 的类和协议,已经在WKWebKit分解成为14类和 3个协议。不要为复杂性的巨大跳跃而惊慌 - 这种新的架构允许大量的新功能:

    classes

    • WKBackForwardList :在网页视图中,之前访问的网页列表,可以通过后退或前进来访问。
    • WKBackForwardListItem:表示Web视图的后退列表中的网页。
    • WKFrameInfo : 包含有关网页框架的信息。
    • WKNavigation:包含用于跟踪网页加载进度的信息。
      • WKNavigationAction:包含有关可能导致导航的操作的信息,用于制定策略决策。
      • WKNavigationResponse:包含有关导航响应的信息,用于制定策略决策。
    • WKPreferences : 封装Web视图的首选项设置。
    • WKProcessPool:表示WebContent进程池
    • WKUserContentController:为JavaScript提供一种发布消息并将用户脚本注入到Web视图的方法。
      • WKScriptMessage:包含有关从网页发送的消息的信息。
      • WKUserScript :表示可以注入到网页的脚本。
    • WKWebViewConfiguration : 用于初始化web视图的属性集合。
    • WKWindowFeatures :请求新的Web试图是,为包含窗口指定可选属性。

    协议

    • WKNavigationDelegate:提供跟踪主框架导航进度和决定主框架和子框架导航的加载策略的方法。
    • WKScriptMessageHandler:提供一种从网页中运行的JavaScript接收消息的方法。
    • WKUIDelegate:提供了代表网页呈现本地用户界面元素的方法。

    UIWebView&WKWebView的API的差异

    WKWebView和UIWebView有很多相似的接口,使得应用程序可以很方便的迁移到WKWebKit。(WKWebView需要在iOS8以及之后的系统中运行)。

    下面是每个类的API比较:

    初始化:

    初始化.png

    载入中

    载入中1.png 载入中2.png

    历史

    历史.png

    Javascript

    Javascript.png

    其它

    其它.png

    分页

    WKWebView 目前缺乏用于分页内容的等效API。

    • var paginationMode: UIWebPaginationMode
    • var paginationBreakingMode: UIWebPaginationBreakingMode
    • var pageLength: CGFloat
    • var gapBetweenPages: CGFloat
    • var pageCount: Int { get }

    WKWebViewConfiguration重构成

    以下属性UIWebView已被分解到一个单独的配置对象中,该配置对象被传递给WKWebView初始值设定项:

    • var allowsInlineMediaPlayback: Bool
    • var mediaPlaybackRequiresUserAction: Bool
    • var mediaPlaybackAllowsAirPlay: Bool
    • var suppressesIncrementalRendering: Bool

    JavaScript ↔︎ Swift通信

    可以在应用程序和其网页内容之间来回传递数据和交互,是WKWebView针对UIWebView的主要改进之一。

    用户脚本注入行为

    WKUserScript允许在文档加载的开始或结束时注入JavaScript行为。这个强大的功能可以让网页内容的跨页面请求以安全和一致的方式被操纵。

    作为一个简单的例子,下面是如何注入用户脚本来改变网页的背景颜色:

    let source = "document.body.style.background = \"#777\";"
    let userScript = WKUserScript(source: source, injectionTime: .AtDocumentEnd, forMainFrameOnly: true)
    
    let userContentController = WKUserContentController()
    userContentController.addUserScript(userScript)
    
    let configuration = WKWebViewConfiguration()
    configuration.userContentController = userContentController
    self.webView = WKWebView(frame: self.view.bounds, configuration: configuration)
    

    WKUserScript使用 JavaScript源进行初始化,可以配置在加载页面开始时,或者结束时注入脚本。或者是配置对所有框架使用此行为,还是只适用主框架。然后将用户脚本添加到传入初始WKUserContentController值设定项的WKWebViewConfiguration对象上WKWebView
    这个例子可以很容易地扩转到页面进行更重大的修改,例如。删除广告,隐藏评论,或者可能将所有可能出现的“云”,进行对接。

    changing all occurrences of the phrase “the cloud” to “my butt”

    消息处理程序

    通过消息处理程序,从网络到应用程序的通信也得到了显着改善。

    就像console.log向Safari Web Inspector调试控制台输出信息一样,来自网页的信息可以通过以下方式传递回应用程序:

    JavaScript
    window.webkit.messageHandlers.{NAME}.postMessage()

    这个API的真正好处在于JavaScript对象被自动序列化到本地Objective-C或Swift对象中。
    该处理程序的名称被配置在addScriptMessageHandler()其中,该寄存器符合该WKScriptMessageHandler协议:

    class NotificationScriptMessageHandler: NSObject, WKScriptMessageHandler {
        func userContentController(userContentController: WKUserContentController, didReceiveScriptMessage message: WKScriptMessage!) {
            print(message.body)
        }
    }
    
    let userContentController = WKUserContentController()
    let handler = NotificationScriptMessageHandler()
    userContentController.addScriptMessageHandler(handler, name: "notification")
    
    

    现在,当一个通知进入应用程序,比如通知在页面上创建一个新对象时,该信息可以通过:

    JavaScript

    window.webkit.messageHandlers.notification.postMessage({body: "..."});
    

    添加用户脚本为使用消息处理程序将状态传回应用程序的网页事件创建接口。

    可以使用相同的方法从页面上刮取信息以在应用程序中显示或分析。

    例如,如果有人专门为NSHipster.com构建浏览器,则可能会有一个按钮在弹出窗口中列出相关的文章:

    // document.location.href == "http://nshipster.com/webkit"
    function getRelatedArticles() {
        var related = [];
        var elements = document.getElementById("related").getElementsByTagName("a");
        for (i = 0; i < elements.length; i++) {
            var a = elements[i];
            related.push({href: a.href, title: a.title});
        }
    
        window.webkit.messageHandlers.related.postMessage({articles: related});
    }
    

    如果你的应用程序不仅仅是一个围绕Web内容的精简容器,而且WKWebView是一个改变游戏规则的游戏。所有您渴望的性能和兼容性终于可用。这是你所希望的一切。

    如果你更喜欢纯粹的本机控制,那么你可能会对iOS 8中的新技术所提供的强大功能和灵活性感到惊讶。像Messages这样的一些股票应用使用WebKit来渲染棘手的内容是一个肮脏的秘密。您可能没有注意到这一事实应该是一个Web视图实际上在应用程序开发最佳实践中占有一席之地的指标。

    相关文章

      网友评论

          本文标题:WKWebView的简介和使用

          本文链接:https://www.haomeiwen.com/subject/fbdpbxtx.html