WKWebViewで戻るボタンを実装したい

Question

###実現したいこと
新たにサイトをタブを開いた際に、戻るボタンを配置を実装して元のサイトに戻りたい
以下のコードでtarget="_blank"でリンク先へ飛べるよう実装しています。
リンク先で戻るボタンがない場合、元のサイトに戻れないため、リンク先で戻るボタンを必要としています。

func webView(_ webView: WKWebView,
                 createWebViewWith configuration: WKWebViewConfiguration,
                 for navigationAction: WKNavigationAction,
                 windowFeatures: WKWindowFeatures) -> WKWebView?
    {
        
        if navigationAction.targetFrame?.isMainFrame != true {
            let newWebView = WKWebView(frame: webView.frame,
                                       configuration: configuration)
            newWebView.load(navigationAction.request)
            newWebView.uiDelegate = self
            webView.superview?.addSubview(newWebView)
            return newWebView
        }
        
        return nil
    }
    
    func webViewDidClose(_ webView: WKWebView) {
        webView.removeFromSuperview()
    }

お分かりの方、ぜひ宜しくお願いします。

Answer 1

新しくwebviewを作る必要がない気がします。

if navigationAction.targetFrame?.isMainFrame != true {
    webView.load(navigationAction.request)
    return nil
}

スワイプでも戻れます。

self.webView.allowsBackForwardNavigationGestures = true

一般的にはツールバーに < とか > のボタンを用意して
下記のメソッドを各ボタンのアクションに充てる感じかなと。

// 戻るとき
if (self.webView.canGoBack) {
self.webView.goBack()
}

// 進むとき
if (self.webView.canGoForward) {
self.webView.goForward()
}

戻れる，進めるようになった際にボタンを有効/無効にしたい場合は
KVOで監視する形になります。例えばこんな感じかなと。

// 宣言
var observations = [NSKeyValueObservation]() // KVOに使う(classの中)

viewDidloadとかに

observations.append(webView.observe(.canGoBack, options: .new){ _, change in
    if let value = change.newValue {
        DispatchQueue.main.async {
            self.backButton.isEnabled = value
            self.backButton.alpha = value ? 1.0 : 0.4
        }
    }
})

observations.append(webView.observe(.canGoForward, options: .new){ _, change in
    if let value = change.newValue {
         DispatchQueue.main.async {
        self.forwardButton.isEnabled = value
        self.forwardButton.alpha = value ? 1.0 : 0.4
        }
    }
})

最後にボタンのアクション。

@IBAction func goBackTapped(_ sender: UIButton) {
    webView.goBack()
}

@IBAction func goForwardTapped(_ sender: UIButton) {
    webView.goForward()
}

Comments

[tomtom1]

ご回答ありがとうございます！確かに、戻るボタンが設置できれば新しくwebviewを作る必要がないですね！window.close()を活用して閉じるボタンも模索してました！
今回新しくwebviewを作らない方法をとった場合、戻るボタンは変わらずして必要かと思いますが、どのようにすれば良いでしょうか？

[TakuyaAso]

スワイプでも戻れます。
self.webView.allowsBackForwardNavigationGestures = true

一般的にはツールバーに < とか > のボタンを用意して
下記のメソッドを各ボタンのアクションに充てる感じかなと。

// 戻るとき
if (self.webView.canGoBack) {
self.webView.goBack()
}

// 進むとき
if (self.webView.canGoForward) {
self.webView.goForward()
}

戻れる，進めるようになった際にボタンを有効/無効にしたい場合は
KVOで監視する形になります。例えばこんな感じかなと。

var observations = [NSKeyValueObservation]() // KVOに使う(classの中)

viewDidloadとかに

observations.append(webView.observe(.canGoBack, options: .new){ _, change in
if let value = change.newValue {
DispatchQueue.main.async {
self.backButton.isEnabled = value
self.backButton.alpha = value ? 1.0 : 0.4
}
}
})

observations.append(webView.observe(.canGoForward, options: .new){ _, change in
if let value = change.newValue {
DispatchQueue.main.async {
self.forwardButton.isEnabled = value
self.forwardButton.alpha = value ? 1.0 : 0.4
}
}
})

@IBAction func goBackTapped(_ sender: UIButton) {
webView.goBack()
}

@IBAction func goForwardTapped(_ sender: UIButton) {
webView.goForward()
}