WKWebView的介紹

WKWebView?是現(xiàn)代 WebKit API 在 iOS 8 和 OS X Yosemite 應(yīng)用中的核心部分。它代替了 UIKit 中的?UIWebView?和 AppKit 中的?WebView,提供了統(tǒng)一的跨雙平臺 API。

自詡擁有 60fps 滾動刷新率、內(nèi)置手勢、高效的 app 和 web 信息交換通道、和 Safari 相同的 JavaScript 引擎,WKWebView?毫無疑問地成為了 WWDC 2014 上的最亮點。

WKWebview提供了API實現(xiàn)js交互 不需要借助JavaScriptCore或者webJavaScriptBridge。使用WKUserContentController實現(xiàn)js native交互。簡單的說就是先注冊約定好的方法,然后再調(diào)用。

UIWebView?&?UIWebViewDelegate?這個兩個東西是如何在 WKWebKit 中被重構(gòu)成 14 個類 3 個協(xié)議的呢。

WKWebKit Framework

一.相關(guān)類(Classes)

1.WKBackForwardList: 之前訪問過的 web 頁面的列表,可以通過后退和前進動作來訪問到。

????WKBackForwardListItem: webview 中后退列表里的某一個網(wǎng)頁。

2.WKFrameInfo: 包含一個網(wǎng)頁的布局信息。

3.WKNavigation: 包含一個網(wǎng)頁的加載進度信息。

????WKNavigationAction: 包含可能讓網(wǎng)頁導(dǎo)航變化的信息,用于判斷是否做出導(dǎo)航變化。

????WKNavigationResponse: 包含可能讓網(wǎng)頁導(dǎo)航變化的返回內(nèi)容信息,用于判斷是否做出導(dǎo)航變化。

4.WKPreferences: 概括一個 webview 的偏好設(shè)置。

5.WKProcessPool: 表示一個 web 內(nèi)容加載池。

6.WKUserContentController: 提供使用 JavaScript post 信息和注射 script 的方法。

????WKScriptMessage: 包含網(wǎng)頁發(fā)出的信息。

????WKUserScript: 表示可以被網(wǎng)頁接受的用戶腳本。

????????WKWebViewConfiguration: 初始化 webview 的設(shè)置。

7.WKWindowFeatures: 指定加載新網(wǎng)頁時的窗口屬性。

二、相關(guān)協(xié)議(Protocols)

1.WKNavigationDelegate: 提供了追蹤主窗口網(wǎng)頁加載過程和判斷主窗口和子窗口是否進行頁面加載新頁面的相關(guān)方法。

2.WKScriptMessageHandler: 提供從網(wǎng)頁中收消息的回調(diào)方法。

3.WKUIDelegate: 提供用原生控件顯示網(wǎng)頁的方法回調(diào)

三、UIWebView?和?WKWebView?的 API 區(qū)別

WKWebView?繼承了?UIWebView?大部分的接口,這讓 app 來繼承 WKWebKit 也簡單了許多(同時隨著更新 iOS 8 的越來越多這也成為了某種必需)。

有興趣的同學(xué)可以看一下這兩個類的 API 區(qū)別:

1、代理

2、頁面加載

3、訪問歷史

4、調(diào)用 Javascript

5、原生混用

6、頁碼


7、重構(gòu)分離開的?WKWebViewConfiguration


四、JavaScript ?? Swift 對話機制

相對于?UIWebView?最大的提升就是數(shù)據(jù)在可以 app 和 web 內(nèi)容之間傳遞。

使用用戶腳本來注入 JavaScript

WKUserScript?允許在正文加載之前或之后注入到頁面中。這個強大的功能允許在頁面中以安全且唯一的方式操作網(wǎng)頁內(nèi)容。

一個簡單的例子如下,用戶改變背景的用戶腳本被插入到網(wǎng)頁中:

WKUserScript?對象可以以 JavaScript 源碼形式初始化,初始化時還可以傳入是在加載之前還是結(jié)束時注入,以及腳本影響的是這個布局還是僅主要布局。于是用戶腳本被加入到?WKUserContentController?中,并且以?WKWebViewConfiguration?屬性傳入到?WKWebView?的初始化過程中。

這個樣例可以簡單擴展為更為高級的頁面修改方法,例如去除廣告、隱藏評論等,更復(fù)雜的樣例見此:讓所有出現(xiàn)的”the cloud”變?yōu)椤眒y butt”

web 和 app 通訊機制也通過 message handler 有很大提升。

就想在Safari 審查元素功能中的?console.log?能在調(diào)試終端打印信息一樣,網(wǎng)頁中的信息也可以通過調(diào)用這個函數(shù)被傳到 app 里:

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

這個 API 真正神奇的地方在于 JavaScript 對象可以_自動轉(zhuǎn)換_為 Objective-C 或 Swift 對象。

Handler 的名字可以通過?WKScriptMessageHandler?協(xié)議中的?addScriptMessageHandler()?接口函數(shù)設(shè)置:

于是當(dāng)通知進入 app 的時候,比如說在頁面中創(chuàng)建一個新對象,相關(guān)信息就可以這樣傳遞:

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

添加用戶腳本來對 web 事件監(jiān)聽并用 Message Handler 將信息傳回 app。

同樣的方法也可以用來收集頁面信息用于 app 的頁面展示或數(shù)據(jù)分析。

例如,如果某人要針對 NSHipster.com 做一個特別的瀏覽器,就可以加一個能夠呼出相似文章列表的按鈕:

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容