WKWebView與JS交互實戰技巧之API介紹

前言

給大家介紹另外一種基于 iOS 8 新推出的 WKWebView 組件,構建出自己的混合開發框架。

WKWebView 簡介

WKWebView 是蘋果在 iOS 8 中引入的新組件,目的是給出一個新的高性能的 Web View 解決方案,擺脫過去 UIWebView 的老舊笨重特別是內存占用量巨大的問題。

蘋果將 UIWebViewDelegate 與 UIWebView 重構成了 14 個類和 3 個協議,引入了不少新的功能和接口,這可以在一定程度上看做蘋果對其封鎖 Web View 內核的行為作出的補償:既然你們都說 UIWebView 太渣,那我就造一個不渣的給你們用唄~~ 眾所周知,連 Chrome 的 iOS 版用的也是 UIWebView 的內核。

WKWebView 有哪些進步呢?

1.將瀏覽器內核渲染進程提取出 App,由系統進行統一管理,這減少了相當一部分的性能損失。

2.js 可以直接使用已經事先注入 js runtime 的 js 接口給 Native 層傳值,不必再通過苦逼的 iframe 制造頁面刷新再解析自定義協議的奇怪方式。

3.支持高達 60 fps 的滾動刷新率,內置了手勢探測。

WKWebView API介紹

WKWebView的頭文件聲明

// webview 配置,具體看下面

@property (nonatomic, readonly, copy) WKWebViewConfiguration *configuration;

// 導航代理

@property (nullable, nonatomic, weak) id navigationDelegate;

// 用戶交互代理

@property (nullable, nonatomic, weak) id UIDelegate;

// 頁面前進、后退列表

@property (nonatomic, readonly, strong) WKBackForwardList *backForwardList;

// 默認構造器

- (instancetype)initWithFrame:(CGRect)frame configuration:(WKWebViewConfiguration *)configuration NS_DESIGNATED_INITIALIZER;

// 已不再使用

- (instancetype)initWithCoder:(NSCoder *)coder NS_UNAVAILABLE;

// 與UIWebView一樣的加載請求API

- (nullable WKNavigation *)loadRequest:(NSURLRequest *)request;

// 加載URL

- (nullable WKNavigation *)loadFileURL:(NSURL *)URL allowingReadAccessToURL:(NSURL *)readAccessURL NS_AVAILABLE(10_11, 9_0);

// 直接加載HTML

- (nullable WKNavigation *)loadHTMLString:(NSString *)string baseURL:(nullable NSURL *)baseURL;

// 直接加載data

- (nullable WKNavigation *)loadData:(NSData *)data MIMEType:(NSString *)MIMEType characterEncodingName:(NSString *)characterEncodingName baseURL:(NSURL *)baseURL NS_AVAILABLE(10_11, 9_0);

// 前進或者后退到某一頁面

- (nullable WKNavigation *)goToBackForwardListItem:(WKBackForwardListItem *)item;

// 頁面的標題,這昆支持KVO的

@property (nullable, nonatomic, readonly, copy) NSString *title;

// 當前請求的URL,它是支持KVO的

@property (nullable, nonatomic, readonly, copy) NSURL *URL;

// 標識當前是否正在加載內容中,它是支持KVO的

@property (nonatomic, readonly, getter=isLoading) BOOL loading;

// 當前加載的進度,范圍為[0, 1]

@property (nonatomic, readonly) double estimatedProgress;

// 標識頁面中的所有資源是否通過安全加密連接來加載,它是支持KVO的

@property (nonatomic, readonly) BOOL hasOnlySecureContent;

// 當前導航的證書鏈,支持KVO

@property (nonatomic, readonly, copy) NSArray *certificateChain NS_AVAILABLE(10_11, 9_0);

// 是否可以招待goback操作,它是支持KVO的

@property (nonatomic, readonly) BOOL canGoBack;

// 是否可以執行gofarward操作,支持KVO

@property (nonatomic, readonly) BOOL canGoForward;

// 返回上一頁面,如果不能返回,則什么也不干

- (nullable WKNavigation *)goBack;

// 進入下一頁面,如果不能前進,則什么也不干

- (nullable WKNavigation *)goForward;

// 重新載入頁面

- (nullable WKNavigation *)reload;

// 重新從原始URL載入

- (nullable WKNavigation *)reloadFromOrigin;

// 停止加載數據

- (void)stopLoading;

// 執行JS代碼

- (void)evaluateJavaScript:(NSString *)javaScriptString completionHandler:(void (^ __nullable)(__nullable id, NSError * __nullable error))completionHandler;

// 標識是否支持左、右swipe手勢是否可以前進、后退

@property (nonatomic) BOOL allowsBackForwardNavigationGestures;

// 自定義user agent,如果沒有則為nil

@property (nullable, nonatomic, copy) NSString *customUserAgent NS_AVAILABLE(10_11, 9_0);

// 在iOS上默認為NO,標識不允許鏈接預覽

@property (nonatomic) BOOL allowsLinkPreview NS_AVAILABLE(10_11, 9_0);

WKWebViewConfiguration配置

WKWebViewConfiguration *config=[[WKWebViewConfiguration alloc] init];

WKPreferences偏好設置

// 設置偏好設置

config.preferences = [[WKPreferences alloc] init];

// 默認為0

config.preferences.minimumFontSize = 10;

// 默認認為YES

config.preferences.javaScriptEnabled = YES;

// 在iOS上默認為NO,表示不能自動通過窗口打開

config.preferences.javaScriptCanOpenWindowsAutomatically = NO;

WKProcessPool內容處理池

WKProcessPool并沒有公開任何的屬性或者方法,不需要配置:

config.processPool=[[WKProcessPool alloc] init];

WKUserContentController內容交互控制器

我們要通過JS與webview內容交互,就需要到這個類了,它的所有屬性及方法說明如下:

// 只讀屬性,所有添加的WKUserScript都在這里可以獲取到

@property (nonatomic, readonly, copy) NSArray *userScripts;

// 注入JS

- (void)addUserScript:(WKUserScript *)userScript;

// 移除所有注入的JS

- (void)removeAllUserScripts;

// 添加scriptMessageHandler到所有的frames中,則都可以通過

// window.webkit.messageHandlers..postMessage()

// 發送消息

// 比如,JS要調用我們原生的方法,就可以通過這種方式了

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

// 根據name移除所注入的scriptMessageHandler

- (void)removeScriptMessageHandlerForName:(NSString *)name;

WKUserScript

在WKUserContentController中,所有使用到WKUserScript。WKUserContentController是用于與JS交互的類,而所注入的JS是WKUserScript對象。它的所有屬性和方法如下:

// JS源代碼

@property (nonatomic, readonly, copy) NSString *source;

// JS注入時間

@property (nonatomic, readonly) WKUserScriptInjectionTime injectionTime;

// 只讀屬性,表示JS是否應該注入到所有的frames中還是只有main frame.

@property (nonatomic, readonly, getter=isForMainFrameOnly) BOOL forMainFrameOnly;

// 初始化方法,用于創建WKUserScript對象

// source:JS源代碼

// injectionTime:JS注入的時間

// forMainFrameOnly:是否只注入main frame

- (instancetype)initWithSource:(NSString *)source injectionTime:(WKUserScriptInjectionTime)injectionTime forMainFrameOnly:(BOOL)forMainFrameOnly;

WKUserScriptInjectionTime

它是一個枚舉類型,只有在文檔開始加載時注入和加載結束時注入。

typedef NS_ENUM(NSInteger, WKUserScriptInjectionTime) {

WKUserScriptInjectionTimeAtDocumentStart,

WKUserScriptInjectionTimeAtDocumentEnd

} NS_ENUM_AVAILABLE(10_10, 8_0);

WKWebsiteDataStore存儲的Web內容

iOS9.0以后才能使用這個類。它是代表webview不同的數據類型,包括cookies、disk、memory caches、WebSQL、IndexedDB數據庫和本地存儲。

從這里看,要優化Webview好像可以通過它來實現,不過要求iOS9.0以上才能使用。現在6.0都沒有拋棄的我,從來不能考慮這種最新的。

WKProcessPool并沒有公開任何的屬性或者方法,不需要配置:

// 默認數據存儲

+ (WKWebsiteDataStore *)defaultDataStore;

// 返回非持久化存儲,數據不會寫入文件系統

+ (WKWebsiteDataStore *)nonPersistentDataStore;

// 已經不可用

- (instancetype)init NS_UNAVAILABLE;

// 只讀屬性,表示是否是持久化存儲

@property (nonatomic, readonly, getter=isPersistent) BOOL persistent;

// 獲取所有web內容的數據存儲類型集,比如cookies、disk等

+ (NSSet *)allWebsiteDataTypes;

// 獲取某些指定數據存儲類型的數據

- (void)fetchDataRecordsOfTypes:(NSSet *)dataTypes completionHandler:(void (^)(NSArray *))completionHandler;

// 刪除某些指定類型的數據

- (void)removeDataOfTypes:(NSSet *)dataTypes forDataRecords:(NSArray *)dataRecords completionHandler:(void (^)(void))completionHandler;

// 刪除某些指定類型的數據且修改日期是指定的日期

- (void)removeDataOfTypes:(NSSet *)websiteDataTypes modifiedSince:(NSDate *)date completionHandler:(void (^)(void))completionHandler;

所有的dataTypes是下面這些系統所定義的:

WK_EXTERN NSString * const WKWebsiteDataTypeDiskCache NS_AVAILABLE(10_11, 9_0);

WK_EXTERN NSString * const WKWebsiteDataTypeMemoryCache NS_AVAILABLE(10_11, 9_0);

WK_EXTERN NSString * const WKWebsiteDataTypeOfflineWebApplicationCache NS_AVAILABLE(10_11, 9_0);

WK_EXTERN NSString * const WKWebsiteDataTypeCookies NS_AVAILABLE(10_11, 9_0);

WK_EXTERN NSString * const WKWebsiteDataTypeSessionStorage NS_AVAILABLE(10_11, 9_0);

WK_EXTERN NSString * const WKWebsiteDataTypeLocalStorage NS_AVAILABLE(10_11, 9_0);

WK_EXTERN NSString * const WKWebsiteDataTypeWebSQLDatabases NS_AVAILABLE(10_11, 9_0);

WK_EXTERN NSString * const WKWebsiteDataTypeIndexedDBDatabases NS_AVAILABLE(10_11, 9_0);

WKWebsiteDataRecord

iOS9.0以后才可用。

website的數據存儲記錄類型,它只有兩個屬性:

// 通常是域名

@property (nonatomic, readonly, copy) NSString *displayName;

// 存儲的數據類型集

@property (nonatomic, readonly, copy) NSSet *dataTypes;

WKSelectionGranularity選擇粒度

它表示在webview上選擇內容的粒度,只有下面這兩種類型:

typedef NS_ENUM(NSInteger, WKSelectionGranularity) {

WKSelectionGranularityDynamic,

WKSelectionGranularityCharacter,

} NS_ENUM_AVAILABLE_IOS(8_0);

它是用于webview內容交互時選擇內容的粒度類型設置。比如說,當使用WKSelectionGranularityDynamic時,而所選擇的內容是單個塊,這時候granularity可能會是單個字符;當所選擇的web內容不限制于某個塊時,granularity可能會是單個塊。

WKNavigationDelegate

@protocol WKNavigationDelegate

@optional

// 決定導航的動作,通常用于處理跨域的鏈接能否導航。WebKit對跨域進行了安全檢查限制,不允許跨域,因此我們要對不能跨域的鏈接

// 單獨處理。但是,對于Safari是允許跨域的,不用這么處理。

// 這個是決定是否Request

- (void)webView:(WKWebView *)webView decidePolicyForNavigationAction:(WKNavigationAction *)navigationAction decisionHandler:(void (^)(WKNavigationActionPolicy))decisionHandler;

// 決定是否接收響應

// 這個是決定是否接收response

// 要獲取response,通過WKNavigationResponse對象獲取

- (void)webView:(WKWebView *)webView decidePolicyForNavigationResponse:(WKNavigationResponse *)navigationResponse decisionHandler:(void (^)(WKNavigationResponsePolicy))decisionHandler;

// 當main frame的導航開始請求時,會調用此方法

- (void)webView:(WKWebView *)webView didStartProvisionalNavigation:(null_unspecified WKNavigation *)navigation;

// 當main frame接收到服務重定向時,會回調此方法

- (void)webView:(WKWebView *)webView didReceiveServerRedirectForProvisionalNavigation:(null_unspecified WKNavigation *)navigation;

// 當main frame開始加載數據失敗時,會回調

- (void)webView:(WKWebView *)webView didFailProvisionalNavigation:(null_unspecified WKNavigation *)navigation withError:(NSError *)error;

// 當main frame的web內容開始到達時,會回調

- (void)webView:(WKWebView *)webView didCommitNavigation:(null_unspecified WKNavigation *)navigation;

// 當main frame導航完成時,會回調

- (void)webView:(WKWebView *)webView didFinishNavigation:(null_unspecified WKNavigation *)navigation;

// 當main frame最后下載數據失敗時,會回調

- (void)webView:(WKWebView *)webView didFailNavigation:(null_unspecified WKNavigation *)navigation withError:(NSError *)error;

// 這與用于授權驗證的API,與AFN、UIWebView的授權驗證API是一樣的

- (void)webView:(WKWebView *)webView didReceiveAuthenticationChallenge:(NSURLAuthenticationChallenge *)challenge completionHandler:(void (^)(NSURLSessionAuthChallengeDisposition disposition, NSURLCredential *__nullable credential))completionHandler;

// 當web content處理完成時,會回調

- (void)webViewWebContentProcessDidTerminate:(WKWebView *)webView NS_AVAILABLE(10_11, 9_0);

@end

WKNavigationActionPolicy

導航動作決定策略:

typedef NS_ENUM(NSInteger, WKNavigationActionPolicy) {

WKNavigationActionPolicyCancel,

WKNavigationActionPolicyAllow,

} NS_ENUM_AVAILABLE(10_10, 8_0);

它是枚舉類型,只有Cancel和Allow這兩種。設置為Cancel就是不允許導航,就不會跳轉鏈接。

WKNavigationResponse

WKNavigationResponse是導航響應類,通過它可以獲取相關響應的信息:

NS_CLASS_AVAILABLE(10_10, 8_0)

@interface WKNavigationResponse : NSObject

// 是否是main frame

@property (nonatomic, readonly, getter=isForMainFrame) BOOL forMainFrame;

// 獲取響應response

@property (nonatomic, readonly, copy) NSURLResponse *response;

// 是否顯示MIMEType

@property (nonatomic, readonly) BOOL canShowMIMEType;

@end

只有接收響應與不接收響應兩種。

WKNavigationAction

WKNavigationAction對象包含關于導航的action的信息,用于make policy decisions。它只有以下幾個屬性:

// 正在請求的導航的frame

@property (nonatomic, readonly, copy) WKFrameInfo *sourceFrame;

// 目標frame,如果這是新的window,它會是nil

@property (nullable, nonatomic, readonly, copy) WKFrameInfo *targetFrame;

// 導航類型,如下面的小標題WKNavigationType

@property (nonatomic, readonly) WKNavigationType navigationType;

// 導航的請求

@property (nonatomic, readonly, copy) NSURLRequest *request;

WKNavigationType

WKNavigationType類型是枚舉類型,它的可選值如下:

typedef NS_ENUM(NSInteger, WKNavigationType) {

// 鏈接已經點擊

WKNavigationTypeLinkActivated,

// 表單提交

WKNavigationTypeFormSubmitted,

// 前進、后退

WKNavigationTypeBackForward,

// 重新載入

WKNavigationTypeReload,

// 表單重新提交

WKNavigationTypeFormResubmitted,

// 其它

WKNavigationTypeOther = -1,

} NS_ENUM_AVAILABLE(10_10, 8_0);

WKUIDelegate

@protocol WKUIDelegate

@optional

// 創建新的webview

// 可以指定配置對象、導航動作對象、window特性

- (nullable WKWebView *)webView:(WKWebView *)webView createWebViewWithConfiguration:(WKWebViewConfiguration *)configuration forNavigationAction:(WKNavigationAction *)navigationAction windowFeatures:(WKWindowFeatures *)windowFeatures;

// webview關閉時回調

- (void)webViewDidClose:(WKWebView *)webView NS_AVAILABLE(10_11, 9_0);

// 調用JS的alert()方法

- (void)webView:(WKWebView *)webView runJavaScriptAlertPanelWithMessage:(NSString *)message initiatedByFrame:(WKFrameInfo *)frame completionHandler:(void (^)(void))completionHandler;

// 調用JS的confirm()方法

- (void)webView:(WKWebView *)webView runJavaScriptConfirmPanelWithMessage:(NSString *)message initiatedByFrame:(WKFrameInfo *)frame completionHandler:(void (^)(BOOL result))completionHandler;

// 調用JS的prompt()方法

- (void)webView:(WKWebView *)webView runJavaScriptTextInputPanelWithPrompt:(NSString *)prompt defaultText:(nullable NSString *)defaultText initiatedByFrame:(WKFrameInfo *)frame completionHandler:(void (^)(NSString * __nullable result))completionHandler;

@end

WKBackForwardList

WKBackForwardList表示webview中可以前進或者后退的頁面列表。其聲明如下:

NS_CLASS_AVAILABLE(10_10, 8_0)

@interface WKBackForwardList : NSObject

// 當前正在顯示的item(頁面)

@property (nullable, nonatomic, readonly, strong) WKBackForwardListItem *currentItem;

// 后一頁,如果沒有就是nil

@property (nullable, nonatomic, readonly, strong) WKBackForwardListItem *backItem;

// 前一頁,如果沒有就是nil

@property (nullable, nonatomic, readonly, strong) WKBackForwardListItem *forwardItem;

// 根據下標獲取某一個頁面的item

- (nullable WKBackForwardListItem *)itemAtIndex:(NSInteger)index;

// 可以進行goback操作的頁面列表

@property (nonatomic, readonly, copy) NSArray *backList;

// 可以進行goforward操作的頁面列表

@property (nonatomic, readonly, copy) NSArray *forwardList;

@end

WKBackForwardListItem

頁面導航前進、后退列表項:

@interface WKBackForwardListItem : NSObject

// 該頁面的URL

@property (readonly, copy) NSURL *URL;

// 該頁面的title

@property (nullable, readonly, copy) NSString *title;

// 初始請求該item的請求的URL

@property (readonly, copy) NSURL *initialURL;

@end

結束

這樣這個框架基本介紹完了,實戰下一篇會給大家著重介紹如何使用.

備注:內容來自CSDN-劉玉剛--AI-技術研究院,原文博客網址:http://blog.csdn.net/baihuaxiu123/article/details/51286109

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。
  • 序言:七十年代末,一起剝皮案震驚了整個濱河市,隨后出現的幾起案子,更是在濱河造成了極大的恐慌,老刑警劉巖,帶你破解...
    沈念sama閱讀 227,837評論 6 531
  • 序言:濱河連續發生了三起死亡事件,死亡現場離奇詭異,居然都是意外死亡,警方通過查閱死者的電腦和手機,發現死者居然都...
    沈念sama閱讀 98,196評論 3 414
  • 文/潘曉璐 我一進店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人,你說我怎么就攤上這事。” “怎么了?”我有些...
    開封第一講書人閱讀 175,688評論 0 373
  • 文/不壞的土叔 我叫張陵,是天一觀的道長。 經常有香客問我,道長,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 62,654評論 1 309
  • 正文 為了忘掉前任,我火速辦了婚禮,結果婚禮上,老公的妹妹穿的比我還像新娘。我一直安慰自己,他們只是感情好,可當我...
    茶點故事閱讀 71,456評論 6 406
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著,像睡著了一般。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發上,一...
    開封第一講書人閱讀 54,955評論 1 321
  • 那天,我揣著相機與錄音,去河邊找鬼。 笑死,一個胖子當著我的面吹牛,可吹牛的內容都是我干的。 我是一名探鬼主播,決...
    沈念sama閱讀 43,044評論 3 440
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢啊……” “哼!你這毒婦竟也來了?” 一聲冷哼從身側響起,我...
    開封第一講書人閱讀 42,195評論 0 287
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎,沒想到半個月后,有當地人在樹林里發現了一具尸體,經...
    沈念sama閱讀 48,725評論 1 333
  • 正文 獨居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內容為張勛視角 年9月15日...
    茶點故事閱讀 40,608評論 3 354
  • 正文 我和宋清朗相戀三年,在試婚紗的時候發現自己被綠了。 大學時的朋友給我發了我未婚夫和他白月光在一起吃飯的照片。...
    茶點故事閱讀 42,802評論 1 369
  • 序言:一個原本活蹦亂跳的男人離奇死亡,死狀恐怖,靈堂內的尸體忽然破棺而出,到底是詐尸還是另有隱情,我是刑警寧澤,帶...
    沈念sama閱讀 38,318評論 5 358
  • 正文 年R本政府宣布,位于F島的核電站,受9級特大地震影響,放射性物質發生泄漏。R本人自食惡果不足惜,卻給世界環境...
    茶點故事閱讀 44,048評論 3 347
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧,春花似錦、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 34,422評論 0 26
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至,卻和暖如春,著一層夾襖步出監牢的瞬間,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 35,673評論 1 281
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留,地道東北人。 一個月前我還...
    沈念sama閱讀 51,424評論 3 390
  • 正文 我出身青樓,卻偏偏與公主長得像,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個殘疾皇子,可洞房花燭夜當晚...
    茶點故事閱讀 47,762評論 2 372

推薦閱讀更多精彩內容