WKWebView 基本使用及與JS交互,以及低版本系統崩潰問題解決

前言

工做中，重構了一個簡單的WKWebView頁面，頁面底部要拼接原生UItableView,因此就寫一寫，遇到的問題總結。

使用

參考資料

OC與JS交互之WKWebView 參考

導入文件

---

#import <WebKit/WebKit.h>

協議

---

<
UIScrollViewDelegate,
WKUIDelegate,
WKNavigationDelegate,
WKScriptMessageHandler
>

單例

---

/** WKWebView 單例*/
- (WKWebView*)WebView{
    if (!_WebView) {
        //js配置
        WKWebViewConfiguration *config = [WKWebViewConfiguration new];
        WKUserContentController* userContentController = [WKUserContentController new];
        [userContentController addScriptMessageHandler:self name:@"showName"];
        config.userContentController = userContentController;
        //單例
        WKWebView* webview = [[WKWebView alloc]initWithFrame:PKScreenFrame configuration:config];
        webview.backgroundColor = PKChatBackgroundColor;
        webview.size = CGSizeMake(PKScreenW, PKScreenH - PKNavigationH);
        webview.navigationDelegate = self;
        webview.UIDelegate = self;
        webview.scrollView.delegate = self;
        _WebView = webview;
    }
    return _WebView;
}

webview代理

---

// 頁面真正開始加載
- (void)webView:(WKWebView *)webView didCommitNavigation:(WKNavigation *)navigation{
}

// 頁面將要加載
- (void)webView:(WKWebView *)webView didStartProvisionalNavigation:(WKNavigation *)navigation{        
}

// 頁面加載完成
- (void)webView:(WKWebView *)webView didFinishNavigation:(null_unspecified WKNavigation *)navigation{
}

// 頁面加載失敗
- (void)webView:(WKWebView *)webView didFailNavigation:(WKNavigation *)navigation withError:(NSError *)error{
}

// 初始化點擊配置
-(WKWebView *)webView:(WKWebView *)webView createWebViewWithConfiguration:(WKWebViewConfiguration *)configuration forNavigationAction:(WKNavigationAction *)navigationAction windowFeatures:(WKWindowFeatures *)windowFeatures{
    if (!navigationAction.targetFrame.isMainFrame) {
        [webView loadRequest:navigationAction.request];
    }
    return nil;
}

js調用native

---

native代理

//js回調
- (void)userContentController:(WKUserContentController *)userContentController didReceiveScriptMessage:(WKScriptMessage *)message{
	if ([message.name isEqualToString:@"showName"]) {
        NSString *info = [NSString stringWithFormat:@"你好 %@, 很高興見到你",message.body];
        [self showMsg:info];
    }    
}

js方法

//其中  showName字段爲native 的消息名(可變)
function btnClick2() {
    window.webkit.messageHandlers.showName.postMessage('xiao黃')
}

native調用js

---

native方法

- (void)btnClick:(UIButton *)sender {
    if (!self.WebView.loading) {
        [self.WebView evaluateJavaScript:@"alertName('小紅')" completionHandler:nil];
    }
}

js方法

function alertName(msg) {
    //alert('你好 ' + msg + ', 我也很高興見到你')
    document.getElementById('name').innerHTML = '你好 ' + msg + ', 我也很高興見到你'
}

注意

崩潰或沒有被釋-描述

• 問題描述 參考一（點我跳轉）
• 問題描述 參考二（點我跳轉）
• 問題描述 參考三（點我跳轉）

崩潰或沒有被釋放-解決

• 崩潰狀況1

ios10如下版本，scrollView.delegate 被引用時，退出控制器會致使崩潰。
@property (nonatomic, strong) WKWebView *webView;

- (void)viewWillDisappear:(BOOL)animated{
    [super viewWillDisappear:animated];
    
    self.webView.navigationDelegate = nil;
    self.webView.UIDelegate = nil;
    self.webView.scrollView.delegate = nil;
}

- (void)viewWillAppear:(BOOL)animated {
    
    if (self.webView) {
        self.webView.navigationDelegate = self;
        self.webView.UIDelegate = self;
        self.webView.scrollView.delegate = self;
    }
    
}

• 崩潰狀況2：

kvo監測高度變化，不移除，會致使控制器不釋放，另外移除了偶爾會被屢次釋放致使崩潰，具體解決辦法暫時沒有。

- (void)dealloc{
    @try {
        [self.webView.scrollView removeObserver:self
                                     forKeyPath:kWebViewContentSize
                                        context:nil];
    } @catch (NSException *exception) {
        DLog(@"屢次刪除kvo報錯了");
    }
}

• 崩潰狀況3：

js引用不釋放。參考問題3，未驗證不在這裏列出。

原文：http://raychow.linkfun.top/2017/12/22/archives/1_ios/wkwebview/index/