Wkwebview - Javascript Confirm And Alert Not Working

I am using WKWebView to open up example.com, and on there I have a test link which is supposed to open up a JS alert, but I can't get it to display on the device, it only works if

Solution 1:

A little late but I would like to add my experience for future reference. The answer of @Bon Bon brought me on the path to the solution while I was trying to make things work with Swift 3 and IOS 10, in which case the code needs some modifications. Firstly you need to implement also WKUIDelegate, so add it to the ViewController declaration:

classViewController: UIViewController, WKUIDelegate {

Then when you instantiate the WKWebView object, as for example like so:

self.webView = WKWebView(frame: self.view.frame)

you need also to assign the correct value to the uiDelegate property of the instance:

self.webView?.uiDelegate = self

Then finally you can use the code provided by @Bon Bon, but note that there are some little differences required by Swift 3, as for example, the name of the presentViewController method becomes present :

funcwebView(_webView: WKWebView, runJavaScriptAlertPanelWithMessagemessage: String, initiatedByFrameframe: WKFrameInfo, completionHandler: @escaping () -> Void) {

    let alertController =UIAlertController(title: nil, message: message, preferredStyle: .actionSheet)

    alertController.addAction(UIAlertAction(title: "Ok", style: .default, handler: { (action) in
        completionHandler()
    }))

    self.present(alertController, animated: true, completion: nil)
}

funcwebView(_webView: WKWebView, runJavaScriptConfirmPanelWithMessagemessage: String, initiatedByFrameframe: WKFrameInfo, completionHandler: @escaping (Bool) -> Void) {

    let alertController =UIAlertController(title: nil, message: message, preferredStyle: .actionSheet)

    alertController.addAction(UIAlertAction(title: "Ok", style: .default, handler: { (action) in
        completionHandler(true)
    }))

    alertController.addAction(UIAlertAction(title: "Cancel", style: .default, handler: { (action) in
        completionHandler(false)
    }))

    self.present(alertController, animated: true, completion: nil)
}

funcwebView(_webView: WKWebView, runJavaScriptTextInputPanelWithPromptprompt: String, defaultText: String?, initiatedByFrameframe: WKFrameInfo, completionHandler: @escaping (String?) -> Void) {

    let alertController =UIAlertController(title: nil, message: prompt, preferredStyle: .alert)

    alertController.addTextField { (textField) in
        textField.text = defaultText
    }

    alertController.addAction(UIAlertAction(title: "Ok", style: .default, handler: { (action) iniflet text = alertController.textFields?.first?.text {
            completionHandler(text)
        } else {
            completionHandler(defaultText)
        }

    }))

    alertController.addAction(UIAlertAction(title: "Cancel", style: .default, handler: { (action) in

        completionHandler(nil)

    }))

    self.present(alertController, animated: true, completion: nil)
}

That made alert, confirmation and text input to work correctly within WKWebView, without any compiler warning in Xcode 8. I'm not an expert Swift programmer, so any useful comment about correctness of the code would be very appreciated.

Solution 2:

You also need to set the uiDelegate on the WKWebView.

import UIKit
import WebKit

classViewController: UIViewController, WKUIDelegate, WKNavigationDelegate {

    var wkWebView: WKWebView!

    publicoverridefuncviewDidLoad() {
        super.viewDidLoad()

        wkWebView =WKWebView(frame: view.bounds, configuration: WKWebViewConfiguration())
        wkWebView.uiDelegate =self
        wkWebView.navigationDelegate =self
        view.addSubview(wkWebView!)
        let url =URL(string: "https://www.w3schools.com/jsref/tryit.asp?filename=tryjsref_alert")!
        wkWebView.load(URLRequest(url: url))
    }

    funcwebView(_webView: WKWebView,
                 runJavaScriptAlertPanelWithMessagemessage: String,
                 initiatedByFrameframe: WKFrameInfo,
                 completionHandler: @escaping () -> Void) {

        let alert =UIAlertController(title: nil, message: message, preferredStyle: .alert)
        let title =NSLocalizedString("OK", comment: "OK Button")
        let ok =UIAlertAction(title: title, style: .default) { (action: UIAlertAction) -> Voidin
            alert.dismiss(animated: true, completion: nil)
        }
        alert.addAction(ok)
        present(alert, animated: true)
        completionHandler()
    }

    funcwebView(_webView: WKWebView, didFinishnavigation: WKNavigation!) {
        wkWebView.evaluateJavaScript("alert('Hello from evaluateJavascript()')", completionHandler: nil)
    }
}

For confirm() and prompt() see the other delegate methods.

Solution 3:

Here is a sample code for various javascript alert implementation in Swift:

It's all about converting info in javascript alert into native UI, and call the completionHandler() to send the user action back to javascript engine.

funcwebView(webView: WKWebView, runJavaScriptAlertPanelWithMessagemessage: String, initiatedByFrameframe: WKFrameInfo, completionHandler: () -> Void) {

        let alertController =UIAlertController(title: nil, message: message, preferredStyle: .ActionSheet)

        alertController.addAction(UIAlertAction(title: "Ok", style: .Default, handler: { (action) in
            completionHandler()
        }))

        self.presentViewController(alertController, animated: true, completion: nil)
}

funcwebView(webView: WKWebView, runJavaScriptConfirmPanelWithMessagemessage: String, initiatedByFrameframe: WKFrameInfo, completionHandler: (Bool) -> Void) {

        let alertController =UIAlertController(title: nil, message: message, preferredStyle: .ActionSheet)

        alertController.addAction(UIAlertAction(title: "Ok", style: .Default, handler: { (action) in
            completionHandler(true)
        }))

        alertController.addAction(UIAlertAction(title: "Cancel", style: .Default, handler: { (action) in
            completionHandler(false)
        }))

        self.presentViewController(alertController, animated: true, completion: nil)
}

funcwebView(webView: WKWebView, runJavaScriptTextInputPanelWithPromptprompt: String, defaultText: String?, initiatedByFrameframe: WKFrameInfo, completionHandler: (String?) -> Void) {

        let alertController =UIAlertController(title: nil, message: prompt, preferredStyle: .ActionSheet)

        alertController.addTextFieldWithConfigurationHandler { (textField) in
            textField.text = defaultText
        }

        alertController.addAction(UIAlertAction(title: "Ok", style: .Default, handler: { (action) iniflet text = alertController.textFields?.first?.text {
                completionHandler(text)
            } else {
                completionHandler(defaultText)
            }

        }))

        alertController.addAction(UIAlertAction(title: "Cancel", style: .Default, handler: { (action) in

            completionHandler(nil)

        }))

        self.presentViewController(alertController, animated: true, completion: nil)
}