Catch certain Javascript function calls in a WebView

Question

I am writing a basic web browser that can only go to a certain website (developed and maintained by another company) for my work, however in order for the log in and the time spent on the site to be counted (two VERY important things for my company) you need to log out with a certain button on the site. I looked at the page source and all that button does is call a javascript function (named something like doLogoff() or something similar) which on a normal browser simply closes the window that is created after you log in. In my application everything is done in ONE window, there are no tabs (there are no need for them) and I'm not entirely sure what the call to close the window does to my application, but the site on the WebView simply stays on that page and only goes back to the login page if you click on a link.

Is there anyway to detect when a certain JavaScript function is called in a WebView? If I can bind that function and make sure the log out is actually being performed, then I can just make the webview go to the login page myself.

Antonio · Accepted Answer · 2018-03-29 15:40:45Z

You can do that with a JavascriptInterface. The following example comes from the documentation. It works the other way round. You can create a function in javascript that will trigger java code in your activity.

You declare your interface in your java code.

public class JavaScriptInterface { Context mContext; /** Instantiate the interface and set the context */ JavaScriptInterface(Context c) { mContext = c; } /** Show a toast from the web page */ @JavascriptInterface public void showToast(String toast) { Toast.makeText(mContext, toast, Toast.LENGTH_SHORT).show(); } }

You add the interface to your WebView

WebView webView = (WebView) findViewById(R.id.webview); webView.addJavascriptInterface(new JavaScriptInterface(this), "Android");

And in your web page you can call the java method from a script

<script type="text/javascript"> function showAndroidToast(toast) { Android.showToast(toast); } </script>

I guess I should have worded my question better. I'm trying to HOOK INTO a javascript function call, so that when it's called on the website, my app can do something. I don't have access to the page's source or anyway to add to it. Hence why I need to use this method.
I answered this below. (hooking into a javascript function call on the website)
You should also add a @JavascriptInterface annotation to a showToast(..) method in your JavaScriptInterface class.
Hey! Thanks for the answer. I've added the @JavascriptInterface annotation as it is needed in order to compile it! :)

mcissel · Accepted Answer · 2013-05-20 21:24:25Z

First, create the JavascriptInterface, prescribed by NathanZ.

Then override the function that you want to hook into, like this:

webview.loadUrl("javascript:" + "var functionNameOriginal = functionName;" + "functionName = function(args) {" + "Android.showToast();" + "functionNameOriginal(args);" + "}");

But you're just loading a javascript method here. Where do you load the page at?

Collectives™ on Stack Overflow

Catch certain Javascript function calls in a WebView

2 Answers 2

4 Comments

1 Comment

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

4 Comments

1 Comment

Related