android WebView与JS交互以及需要注意问题

 

1.android中利用webview调用的js代码。

Android 中可以通过webview来实现和js的交互，在程序中调用js代码，只需要将webview控件的支持js的属性设置为true，，然后通过loadUrl就可以直接进行调用，如下所示：

mWebView.getSettings().setJavaScriptEnabled(true);

方法1：mWebView.loadUrl("javascript:goBack()");

方法2：mWebView.loadUrl(url);

2.在JS中调用Android代码，需要在webview控件中添加javascriptInterface。如下所示：

mWebView.addJavascriptInterface(new Object() { 

            public void clickOnAndroid() { 

                mHandler.post(new Runnable() { 

                    public void run() { 

                        Toast.makeText(Test.this, "测试JS调用Android", Toast.LENGTH_LONG).show();

                    } 

                }); 

            } 

        }, "demo");

在网页中，只需要像调用js方法一样，进行调用就可以

<div id='b'><a οnclick="window.demo.clickOnAndroid()">b.c</a></div>

或JS中调用Android方法

function goBack(){

demo.clickOnAndroid();

}

3. Android代码调用js并传参

首先需要带参数的js函数，如function test(str)，然后只需在调用js时传入参数即可，如下所示：

mWebView.loadUrl("javascript:test('aa')");

4.Js中调用java函数并传参

首先一样需要带参数的函数形式，但需注意此处的参数需要final类型，即得到以后不可修改，如果需要修改其中的值，可以先设置中间变量，然后进行修改。如下所示：

mWebView.addJavascriptInterface(new Object() { 

@JavascriptInterface

            public void clickOnAndroid(final String) { 

                mHandler.post(new Runnable() { 

                    public void run() { 

                        Toast.makeText(Test.this, "测试调用"+s, Toast.LENGTH_LONG).show();

                    }

                });

            } 

        }, "demo");

然后在html页面中，利用如下代码<div id='b'><a οnclick="window.demo.clickOnAndroid(2)">b.c</a></div>，

即可实现调用

 

4.Android模拟JS调用Android方法

webview.loadurl("javascript:window.demo.clickOnAndroid('1')");

 

需要注意的是

1、webView必须设置支持JS

settings.setJavaScriptEnabled(true);

2、如果想要webView弹出Alert 必须设置

mWebView.setWebChromeClient(new WebChromeClient());

3、Android系统4.2以后在JS调用WebView的接口方法中必须添加@JavascriptInterface，否则JS调用webView控制会打印出

[INFO:CONSOLE(4)] "Uncaught TypeError: Object [object Object] has no method 'c'"的异常。原因是因为4.2系统之前，JS调用WebView可以使用反射将webView中的所有内容拿到，影响系统的安全性。而4.2以后系统为了安全性考虑，如果加上上面的注解 ，则JS不可以直接调用此方法，在安全性能上有所提升

4、webView连接服务器拿到JS却拿不到服务器数据，是因为未设置settings.setDomStorageEnabled(true); 其默认值为false