Search code examples
iosswiftuiwebview

UIWebView and JavaScriptInterface in Swift


How can I to create the JavascriptInterface channel from my web site to my UIWebView?

Example in Android:

webView.addJavascriptInterface(new WebAppInterface(this), "Android");

And from this JavascriptInterface I would like to draw the methods, as for example:

func webViewDidStartLoad(webView: UIWebView)

or

myActivityIndicator.startAnimating()

How can I do?


Solution

  • For WKWebView: source here

    JavaScript

    function callNativeApp () {
        try {
                webkit.messageHandlers.callbackHandler.postMessage("Hello from JavaScript");
        } catch(err) {
                console.log('The native context does not exist yet');
        }
    }
    

    Swift

    import WebKit
    class ViewController: UIViewController, WKScriptMessageHandler {
    
        @IBOutlet var containerView: UIView? = nil
    
        var webView: WKWebView?
    
        override func loadView() {
            super.loadView()
    
            let contentController = WKUserContentController()
            contentController.addScriptMessageHandler(self, name: "callbackHandler")
            let config = WKWebViewConfiguration()
            config.userContentController = contentController
    
            self.webView = WKWebView( frame: self.containerView!.bounds, configuration: config)
            self.view = self.webView
    
        }
    
        override func viewDidLoad() {
            super.viewDidLoad()
    
            //I use the file html in local
            let path = NSBundle.mainBundle().pathForResource("index", ofType: "html") 
            let url = NSURL(fileURLWithPath: path!)
            let req = NSURLRequest(URL: url)
            self.webView!.loadRequest(req)
    
        }
    
        func userContentController(userContentController: WKUserContentController, didReceiveScriptMessage message: WKScriptMessage) {// edit: changed fun to func
            if (message.name == "callbackHandler"){
                print("\(message.body)")
            }
        }
    
    }
    

    For UIWebView: source here

    JavaScript in HTML

            <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
        <script>
            (function(){
                $(window).load(function(){
    
                   $('.clickMe').on('click', function(){
                       window.location = "foobar://fizz?Hello_from_javaScript";
                   });
                });
             })(jQuery);
        </script>
    

    Swift

    import UIKit
    class ViewController: UIViewController, UIWebViewDelegate {
    
        @IBOutlet weak var Web: UIWebView!
    
        override func viewDidLoad() {
            super.viewDidLoad()
    
        let path = NSBundle.mainBundle().pathForResource("index", ofType: "html")
            let url = NSURL(fileURLWithPath: path!)
            let req = NSURLRequest(URL: url)
            Web.delegate = self
            Web.loadRequest(req)
        }
    
        func webView(webView: UIWebView, shouldStartLoadWithRequest request: NSURLRequest, navigationType: UIWebViewNavigationType) -> Bool {
            if request.URL?.query != nil {
                print("\(request.URL!.query!)")
            }
            return true
        }
    
    }