UIWebView and JavaScriptInterface in Swift

Question

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?

zehata · Accepted Answer · 2018-07-04 07:05:27Z

29

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
    }

}

edited Jul 4, 2018 at 7:05

zehata

3,6942 gold badges17 silver badges24 bronze badges

answered May 22, 2016 at 11:29

Phocs

2,5305 gold badges23 silver badges38 bronze badges

Sign up to request clarification or add additional context in comments.

5 Comments

Raghuram Over a year ago

How to load local html file inside WKWebView?

iPeter Over a year ago

I am having error in js. e.g: webkit is undefined. What to do?

Bhavin_m Over a year ago

@iPeter did u import the Webkit?? import WebKit and add the library WebKit.framework to your Build Phase.

Hafiz Anser Over a year ago

Could you please tell me where you added the "Android" keyword that added in the webView.addJavascriptInterface(new WebAppInterface(this), "Android"); I want to add this keyword in my iOS app. Please help me. Thanks

stackich Over a year ago

has anyone ever found another way except the using postMessage(), calling Swift methods directly from Swift like iosListener.someMethod(), where some method for example returns a string, and iOSListener is name of userContentController, as we use it for postMessage() ?

Community · Accepted Answer · 2017-05-23 10:30:43Z

5

Here's a quick example:

Register a URL Scheme such as foobar in Xcode

Handle this URL Scheme in your web view

func webView(webView: UIWebView, shouldStartLoadWithRequest request: NSURLRequest, navigationType: UIWebViewNavigationType) -> Bool {
    if request.URL?.query?.containsString("show_activity_indicator=true") {
        myActivityIndicator.startAnimating()
    }
}

Finally, call this from your JavaScript

// Show your activity indicator from JavaScript.
window.location = "foobar://fizz?show_activity_indicator=true"

Note: See my question here for more information on web view communication in iOS.

edited May 23, 2017 at 10:30

CommunityBot

11 silver badge

answered May 21, 2016 at 4:15

paulvs

12.1k3 gold badges44 silver badges66 bronze badges

Collectives™ on Stack Overflow

UIWebView and JavaScriptInterface in Swift

2 Answers 2

5 Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

5 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related