Open certain links in Safari from WKWebView

Question

I have another questions with WKWebView.

The following View is called with an request parameter which defines the complete url:

struct TrainerTab: UIViewRepresentable {
    
    let request: String
    private let hostingUrl: String = "https://page.tld"
    
    func makeUIView(context: Context) -> WKWebView {
        return WKWebView()
    }
    
    func updateUIView(_ uiView: WKWebView, context: Context) {
        let url = "\(hostingUrl)/\(request)"
        uiView.load(URLRequest(url: URL(string: url)!))
    }
}

The HTML-Files from the page.tld have some href-Links. I would like to open them in Safari. I read, that I have to implement the delegate method that gets called when the user taps a link.

But how can I do this?

Answer 1

You can use a Coordinator in your UIViewRepresentatable to act as a navigation delegate for the WKWebView:

struct TrainerTab: UIViewRepresentable {
    
    let request: String
    private let hostingUrl: String = "https://page.tld"
    
    func makeCoordinator() -> Coordinator {
        Coordinator()
    }
    
    func makeUIView(context: Context) -> WKWebView {
        return WKWebView()
    }
    
    func updateUIView(_ uiView: WKWebView, context: Context) {
        uiView.navigationDelegate = context.coordinator
        let url = "\(hostingUrl)/\(request)"
        uiView.load(URLRequest(url: URL(string: url)!))
    }
    
    class Coordinator : NSObject, WKNavigationDelegate {
        func webView(_ webView: WKWebView, decidePolicyFor navigationAction: WKNavigationAction, decisionHandler: @escaping (WKNavigationActionPolicy) -> Void) {
            guard let url = navigationAction.request.url else {
                decisionHandler(.allow)
            }
            
            //make some conditions based on the URL here
            if myCondition {
                decisionHandler(.cancel)
                UIApplication.shared.open(url)
            } else {
                decisionHandler(.allow)
            }
        }
    }
}