微信 iOS 客戶端將于3月1日前逐步升級為WKWebview內核,2014年推出的WKWebView將替代UIKit 中笨重，內存泄漏的UIWebView，其擁有滾動刷新率與safari下相同的JavaScript 引擎優勢。
常用API
//webview配置
@property (nonatomic, readonly, copy) WKWebViewConfiguration *configuration;
//頁面標題，支持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;
// 歷史訪問列表;
@property (nonatomic, readonly, strong) WKBackForwardList *backForwardList;
//標識是否支持左右swipe手勢，是否可以前進后退，默認NO
@property (nonatomic) BOOL allowsBackForwardNavigationGestures;
//當前加載進度【0，1】
@property (nonatomic, readonly) double estimatedProgress;
//標識頁面中所有資源是否臺安縣過安全加密連接來加載，支持KVO
@property (nonatomic, readonly) BOOL hasOnlySecureContent;
//是否可以執行goback操作，支持KVO
@property (nonatomic, readonly) BOOL canGoBack;
//是否可以執行gofarward操作，支持KVo
@property (nonatomic, readonly) BOOL canGoForward;
//返回上一頁（如果不能，則什么都不做）
- (nullable WKNavigation *)goBack;
//進入下一頁（如果不能，則什么都不做）
- (nullable WKNavigation *)goForward;
//重新載入頁面
- (nullable WKNavigation *)reload;
//重新載入原始頁面
- (nullable WKNavigation *)reloadFromOrigin;
//停止加載數據
- (void)stopLoading;
//執行JS 代碼
- (void)evaluateJavaScript:(NSString *)javaScriptString completionHandler:(void (^ _Nullable)(_Nullable id, NSError * _Nullable error))completionHandler;
JavaScript配置相關
//所有添加的WKUserScript都在這里
@property (nonatomic, readonly, copy) NSArray<WKUserScript *> *userScripts;
//注入JS
- (void)addUserScript:(WKUserScript *)userScript;
//移除所有注入的JS
- (void)removeAllUserScripts;
//JS調用原生方法可能過下面方法
//添加scriptMessageHandler到所有frames中，都可以通過
//window.webkit.messageHandlers.<name>.postMessage(<messagebody>)
- (void)addScriptMessageHandler:(id <WKScriptMessageHandler>)scriptMessageHandler name:(NSString *)name;
//根據name移除所有注入的scriptMessageHandler
- (void)removeScriptMessageHandlerForName:(NSString *)name;
加載相關
//從URLRequest加載
- (nullable WKNavigation *)loadRequest:(NSURLRequest *)request;
//從本地加載，僅限iOS 9以上
- (nullable WKNavigation *)loadFileURL:(NSURL *)URL allowingReadAccessToURL:(NSURL *)readAccessURL API_AVAILABLE(macosx(10.11), ios(9.0));
//從HTML字符串加載
- (nullable WKNavigation *)loadHTMLString:(NSString *)string baseURL:(nullable NSURL *)baseURL;
//從二進制流中加載
- (nullable WKNavigation *)loadData:(NSData *)data MIMEType:(NSString *)MIMEType characterEncodingName:(NSString *)characterEncodingName baseURL:(NSURL *)baseURL API_AVAILABLE(macosx(10.11), ios(9.0));
代理相關
WKNavigationDelegate
//在發送請求前，決定是否跳轉
- (void)webView:(WKWebView *)webView decidePolicyForNavigationAction:(WKNavigationAction *)navigationAction decisionHandler:(void (^)(WKNavigationActionPolicy))decisionHandler;
//收到服務器的響應，根據response相關信息，決定是否跳轉，
//decisionHandler必須調用以決定是否跳轉。
//WKNavigationResponsePolicyCancel-取消跳轉
//WKNavigationResponsePolicyAllow-允許跳轉
- (void)webView:(WKWebView *)webView decidePolicyForNavigationResponse:(WKNavigationResponse *)navigationResponse decisionHandler:(void (^)(WKNavigationResponsePolicy))decisionHandler;
//準備加載頁面 == shouldStartLoadWithRequest
- (void)webView:(WKWebView *)webView didStartProvisionalNavigation:(null_unspecified WKNavigation *)navigation;
//開始獲取頁面內容
- (void)webView:(WKWebView *)webView didCommitNavigation:(null_unspecified WKNavigation *)navigation;
//頁面加載完成== didFinishLoad
- (void)webView:(WKWebView *)webView didFinishNavigation:(null_unspecified WKNavigation *)navigation;
//頁面內容加載完成，iOS 9
- (void)webViewWebContentProcessDidTerminate:(WKWebView *)webView API_AVAILABLE(macosx(10.11), ios(9.0));
//頁面跳轉失敗 == didFailLoadWithError
- (void)webView:(WKWebView *)webView didFailNavigation:(null_unspecified WKNavigation *)navigation withError:(NSError *)error;
//頁面加載失敗
- (void)webView:(WKWebView *)webView didFailProvisionalNavigation:(null_unspecified WKNavigation *)navigation withError:(NSError *)error;
WKUIDelegate
// 創建新的WebView;
- (WKWebView *)webView:(WKWebView *)webView createWebViewWithConfiguration:(WKWebViewConfiguration *)configuration forNavigationAction:(WKNavigationAction *)navigationAction windowFeatures:(WKWindowFeatures *)windowFeatures {}
// 攔截警告框
- (void)webView:(WKWebView *)webView runJavaScriptAlertPanelWithMessage:(NSString *)message initiatedByFrame:(WKFrameInfo *)frame completionHandler:(void (^)(void))completionHandler {}
// 攔截確認框
- (void)webView:(WKWebView *)webView runJavaScriptConfirmPanelWithMessage:(NSString *)message initiatedByFrame:(WKFrameInfo *)frame completionHandler:(void (^)(BOOL))completionHandler {}
基本使用
@interface ViewController ()<WKNavigationDelegate,WKScriptMessageHandler>
@property(nonatomic,retain)WKWebView *webView;
@property (nonatomic,retain)UIProgressView *progressView;
@property (nonatomic,retain)WKUserContentController *userContentController;
@end
-(WKWebView*)webView {
if (!_webView) {
//先實例化配置類 以前UIWebView的屬性有的放到了這里
WKWebViewConfiguration * configuration = [[WKWebViewConfiguration alloc]init];
//注冊供js調用的方法
_userContentController =[[WKUserContentController alloc]init];
//彈出登錄
[_userContentController addScriptMessageHandler:self name:@"loginVC"];
//進入詳情頁
[_userContentController addScriptMessageHandler:self name:@"gotodetailVC"];
configuration.userContentController = _userContentController;
configuration.preferences.javaScriptEnabled = YES;//打開js交互
//創建webView
_webView = [[WKWebView alloc]initWithFrame:[UIScreen mainScreen].bounds configuration:configuration];
_webView.navigationDelegate = self;
_webView.allowsLinkPreview = YES;//允許預覽鏈接
_webView.allowsBackForwardNavigationGestures = YES;//允許滑動返回
//創建進度條,WkWebView自帶預估進度
_progressView = [[UIProgressView alloc]initWithFrame:CGRectMake(0.5, 0, _webView.frame.size.width, 2)];
_progressView.tintColor = [UIColor blueColor];
_progressView.trackTintColor = [UIColor whiteColor];
[_webView addSubview:_progressView];
//添加觀察者拿到進度
[_webView addObserver:self forKeyPath:@"estimatedProgress" options:NSKeyValueObservingOptionNew context:nil];
//創建請求
NSURL *url = [NSURL URLWithString:@"https://www.baidu.com"];
//可變的請求可以設置緩存
NSMutableURLRequest *request = [NSMutableURLRequest requestWithURL:url];
request.cachePolicy = NSURLRequestReturnCacheDataElseLoad;
//加載
[_webView loadRequest:request];
}
return _webView;
}
//設置進度條
-(void)observeValueForKeyPath:(NSString *)keyPath ofObject:(id)object change:(NSDictionary<NSKeyValueChangeKey,id> *)change context:(void *)context{
if ([keyPath isEqualToString:@"estimatedProgress"]) {
_progressView.hidden = NO;
CGFloat progress = [change[@"new"] floatValue];
[_progressView setProgress:progress];
if (progress == 1.0) {
_progressView.hidden = YES;
}
}
}
JS 與 OC 的交互
- JS 調用OC 方法時可以發送請求,
或通過WKUIDelegate(alert 和confirm),OC 進行攔截區分請求或彈窗實現交互。- 通過WKScriptMessageHandler 參考文檔
JS 調用 oc 方法
JS寫法
window.webkit.messageHandlers.<name>.postMessage(<messageBody>)
//其中<name>，就是上面方法里的第二個參數`name`。
//例如我們調用API的時候第二個參數填@"Share"，那么在JS里就是:
//window.webkit.messageHandlers.Share.postMessage(<messageBody>)
//<messageBody>是一個鍵值對，鍵是body，值可以有多種類型的參數。
// 在`WKScriptMessageHandler`協議中，我們可以看到mssage是`WKScriptMessage`類型，有一個屬性叫body。
// 而注釋里寫明了body 的類型：
Allowed types are NSNumber, NSString, NSDate, NSArray, NSDictionary, and NSNull.
//JS調用OC方法
- (void)userContentController:(WKUserContentController *)userContentController didReceiveScriptMessage:(WKScriptMessage *)message{
if(message.name ==nil || [message.name isEqualToString:@""])
return;
//message body : js 傳過來值
NSLog(@"message.body ==%@",message.body);
if ([message.name isEqualToString:@"loginVC"])
{
[self showLoginView];
}
else if ([message.name isEqualToString:@"gotodetailVC"])
{
//進入詳情頁
NSString*url = [message.body objectForKey:@"body"];
[self gotodetial:url];
}
}
oc 調用JS 方法
//OC調用JS方法,給JS傳值
//加載完成后通過evaluateJavaScript實現傳值
[webView evaluateJavaScript:@"document.getElementById(\"content\").offsetHeight;" completionHandler:^(id _Nullable result, NSError * _Nullable error) {
//獲取頁面高度，并重置webview的frame
CGFloat documentHeight = [result doubleValue];
CGRect frame = webView.frame;
frame.size.height = documentHeight+[UIScreen mainScreen].bounds.size.height-58 /*顯示不全*/;
webView.frame = frame;
}];
// NSString *js = [NSString stringWithFormat:@"isLogin(%d)",[[UserInfoSingleton shareUserInfoSingleton] isLogin]];
// [webView evaluateJavaScript:js completionHandler:^(id item, NSError * _Nullable error) {
// }];
// NSString *js1 = [NSString stringWithFormat:@"userId(\'%@\')",[UserInfoSingleton shareUserInfoSingleton].userId];
// [webView evaluateJavaScript:js1 completionHandler:^(id item, NSError * _Nullable error) {
//
// }];
- WebViewJavascriptBridge參考文檔
