让Java和JavaScript进行交互

本篇博文参考自:http://droidyue.com/blog/2014/09/20/interaction-between-java-and-javascript-in-android/

我们在使用webview时可以让java代码和网页中的js代码进行交互,本文就简单说明下二者是如何交互的。

 

一、JS调用java代码

1.1 网页的代码:

<html>
<script type="text/javascript">

    function toastMessage(message) {
        window.control.toastMessage(message)
    }

    function sumToJava(number1, number2){
       window.control.onSumResult(number1 + number2)
    }
</script>
Java-Javascript Interaction In Android
</html>

可以看见,这个网页代码中有js的代码,主要代码片段如下:

    function toastMessage(message) {
        window.control.toastMessage(message)
    }

    function sumToJava(number1, number2){
       window.control.onSumResult(number1 + number2)
    }

可以发现这里用了一个方法:window.control.xxxxx。这里的control需要在android端实现,网页这里只需要调用就行。

调用格式为:window.jsInterfaceName.methodName(parameterValues) 此例中我们使用的是control作为注入接口名称,所以变成了:

 window.control.toastMessage(message)

 

1.2 Android端

package com.example.javajsinteractiondemo;

import android.annotation.SuppressLint;
import android.app.Activity;
import android.os.Bundle;
import android.util.Log;
import android.view.Menu;
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 static final String LOGTAG = "MainActivity";
  @SuppressLint("JavascriptInterface")
  @Override
  protected void onCreate(Bundle savedInstanceState) {
      super.onCreate(savedInstanceState);
      setContentView(R.layout.activity_main);
final WebView myWebView = (WebView) findViewById(R.id.myWebView); WebSettings settings = myWebView.getSettings(); settings.setJavaScriptEnabled(true); myWebView.addJavascriptInterface(new JsInteration(), "control"); myWebView.setWebChromeClient(new WebChromeClient() {}); myWebView.loadUrl("file:///android_asset/js_java_interaction.html"); } public class JsInteration { @JavascriptInterface public void toastMessage(String message) { Toast.makeText(getApplicationContext(), message, Toast.LENGTH_LONG).show(); } @JavascriptInterface public void onSumResult(int result) { Log.i(LOGTAG, "onSumResult result=" + result); } } }

可以看到,webview中用 addJavascriptInterface 方法定义了一个注入接口和类:control & JsInteration。然后在之后就写好了JsInteration的实现方法:toastMessage & onSumResult,这样在js中调用时android就知道js用的是什么方法了。 

 

二、java调用js

调用js的方法很简单和加载网页完全一致

基本格式:webView.loadUrl(“javascript:methodName(parameterValues)”)

例子1:

无参数方法

String call = "javascript:sayHello()";
webView.loadUrl(call);

例子2:

注意对于字符串作为参数值需要进行转义双引号

String call = "javascript:alertMessage(\"" + "content" + "\")";
webView.loadUrl(call);

 

 

关于如何安全的进行交互,避免注入攻击,请参考:http://mobile.51cto.com/aprogram-452011.htm

关于如何获取js的返回值,请参考:http://droidyue.com/blog/2014/09/20/interaction-between-java-and-javascript-in-android/

 

你可能感兴趣的:(JavaScript)