Webview Javascript functions?

[Onam]

I'm attempting to invoke certain javascript functions from an html page running inside an android webview. The code below attempts to perform something very simple: from the android app, call a javascript function with a test message, which in turn runs a java function back in the android app that shows the test message via toast.

The javascript function is as follows:

function testEcho(message){
     window.JSInterface.doEchoTest(message);
}

I tried calling the javascript from the WebView in the following methods without success:

myWebView.loadUrl("javascript:testEcho(Hello World!)");
mWebView.loadUrl("javascript:(function () { " + "testEcho(Hello World!);" + "})()");

I had JavaScript enabled in the WebView.

myWebView.getSettings().setJavaScriptEnabled(true);
// register class containing methods to be exposed to JavaScript
myWebView.addJavascriptInterface(myJSInterface, "JSInterface");

And now for the Java Class.

public class JSInterface{

private WebView mAppView;
public JSInterface  (WebView appView) {
        this.mAppView = appView;
    }

    public void doEchoTest(String echo){
        Toast toast = Toast.makeText(mAppView.getContext(), echo, Toast.LENGTH_SHORT);
        toast.show();
    }
}

I've spent a lot of time googling to figure out what I'm doing wrong. I utilised this strategy in all of the examples I found here. Is there something wrong here?

 

[Phro0244]

It looks like you're on the right track, but there are a few issues with the code you provided.

Firstly, when calling the testEcho function in your loadUrl calls, you need to pass the message as a string by enclosing it in quotes, like this:

scssCopy code
myWebView.loadUrl("javascript:testEcho('Hello World!')");
mWebView.loadUrl("javascriptfunction () { " + "testEcho('Hello World!');" + "})()");

Secondly, you need to make sure that the JSInterface class is instantiated and passed to the WebView before you try to call the testEcho function. Here's an example of how you could do this:

scssCopy code
// create an instance of the JSInterface class
JSInterface myJSInterface = new JSInterface(myWebView);

// add the JSInterface instance to the WebView
myWebView.addJavascriptInterface(myJSInterface, "JSInterface");

// call the testEcho function
myWebView.loadUrl("javascript:testEcho('Hello World!')");

Finally, you need to make sure that the WebView is fully loaded before you try to call any JavaScript functions. You can do this by setting a WebViewClient and waiting for the onPageFinished callback before calling loadUrl. Here's an example:

typescriptCopy code
myWebView.setWebViewClient(new WebViewClient() {
@Override
public void onPageFinished(WebView view, String url) {
// the WebView is fully loaded, so we can call testEcho now
myWebView.loadUrl("javascript:testEcho('Hello World!')");
}
});

// load the HTML file into the WebView
myWebView.loadUrl("file:///android_asset/my_file.html");

Make sure that you replace my_file.html with the name of your HTML file. Also, make sure that your HTML file contains the testEcho function.

I hope this helps! Let me know if you have any other questions.