在Android开发中，经常使用WebView展示需要实时更新的网页内容，这样服务端修改就可以而不需要App发新版本，而H5页面里面会有JavaScript代码处理一些业务逻辑。这里就会涉及到Android里面的Java代码与JavaScript交互。例如，点击H5里面的按钮，需要调用Android里面的一些方法，或者Android里面的一些方法，需要把处理结果传给H5使用。那么两者之间是如何交互的呢？请看下面的示例代码。
MainActivity.java代码：
package com.example.androidjstest;
import android.app.Activity;
import android.os.Bundle;
import android.webkit.JavascriptInterface;
import android.webkit.WebChromeClient;
import android.webkit.WebSettings;
import android.webkit.WebView;
import android.webkit.WebViewClient;
import android.widget.Toast;
public class MainActivity extends Activity {
private WebView myWebView;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
myWebView = (WebView) findViewById(R.id.myWebView);
WebSettings settings = myWebView.getSettings();
settings.setJavaScriptEnabled(true);
myWebView.addJavascriptInterface(new JsObject(), "control");
myWebView.setWebChromeClient(new WebChromeClient() {
});
myWebView.setWebViewClient(new WebViewClient() {
@Override
public void onPageFinished(WebView view, String url) {
super.onPageFinished(view, url);
callJsMethod();
}
});
myWebView.loadUrl("file:///android_asset/js_java_interaction.html");
}
private void callJsMethod() {
// webView调用js的基本格式为webView.loadUrl(“javascript:methodName(parameterValues)”)
String call = "";
// call = "javascript:sayHello()";
// 调用JavaScript里面放入sumToJava()方法
call = "javascript:sumToJava(1,2)";
myWebView.loadUrl(call);
}
class JsObject {
@JavascriptInterface
public void toastMessage(String message) {
Toast.makeText(getApplicationContext(), message, Toast.LENGTH_LONG)
.show();
}
// JavaScript调用Android里面的Java代码
@JavascriptInterface
public void onSumResult(int result) {
Toast.makeText(getApplicationContext(), result + "",
Toast.LENGTH_LONG).show();
}
}
}
H5代码，暂时放在App资源文件夹里面，方便调试：
<html>
<!-- js调用Java：调用格式为 window.jsInterfaceName.methodName(parameterValues) -->
<script type="text/javascript">
function sayHello() {
alert("Hello")
}
function sumToJava(number1, number2){
window.control.onSumResult(number1 + number2)
}
</script>
Test Java And Javascript Interaction In Android
</html>settings.setJavaScriptEnabled(true);
myWebView.addJavascriptInterface(new JsObject(), “control”);
这两行代码，使能JavaScript，然后向WebView注册一个名叫“control”的对象，然后在JS中可以访问到control这个对象，就可以调用这个对象的一些方法，最终可以调用到Java代码中，从而实现了JS与Java代码的交互。
通过示例代码能看到，它们在交互的时候，是按照一定格式的。
webView调用js的基本格式为webView.loadUrl(“javascript:methodName(parameterValues)”);
给loadUrl传入字符串参数，methodName是JavaScript中定义的方法名，parameterValues和JavaScript中所调用方法的参数相一致。
js调用Java代码，调用格式为 window.jsInterfaceName.methodName(parameterValues);
jsInterfaceName，也就是Java代码中myWebView.addJavascriptInterface(new JsObject(), “control”)里面的第二个参数，methodName对应Java代码中的方法名，parameterValues是这个方法相对应的参数。
以上就是两者交互的方法。另外，在嵌入H5页面的时候，还要注意一点，就是用addJavascriptInterface可能导致不安全，因为JS可能包含恶意代码，涉及到JS注入漏洞的问题。