Android WebView与JS交互：实例传值与方法对接

本文档详细探讨了在Android开发中，如何实现WebView与JavaScript之间的交互传值问题，尤其是在混合应用开发中，当需要在原生Java代码与嵌入的Web页面之间共享数据时。首先，我们理解一下为什么要进行这样的交互：在许多场景中，开发者可能会利用WebView加载网页，并希望能在JavaScript中访问或修改由Java提供的数据，以增强用户体验。 重点在于如何将Java对象实例传递给JavaScript。为了做到这一点，我们首先在HTML文件中定义一个JavaScript函数，如`callJS()`，这个函数接收一个名为`person`的对象作为参数。在HTML里，我们使用`getElementById`来引用这个对象并获取其`age`、`name`和`sex`属性。 然后，我们回到Android端，创建一个名为`Person`的Java类，继承自`Activity`或`Fragment`等，并实现`JavascriptInterface`接口。这是因为，为了使Java对象能在JavaScript中被调用，我们必须标记某些方法为`@JavascriptInterface`。在这个例子中，`getAge()`、`getName()`和`getSex()`方法都具有这个注解。 创建`Person`类的代码如下： ```java package com.loonggg.webview; import android.webkit.JavascriptInterface; public class Person { private String name; private String age; private String sex; @JavascriptInterface public String getAge() { return age; } // 类的其他方法，例如: public String getName() { return name; } public String getSex() { return sex; } // 构造函数和getter/setter方法省略 } ``` 在Java端，通过`WebViewClient`或`WebChromeClient`的`addJavascriptInterface()`方法将`Person`实例绑定到JavaScript上下文，允许JavaScript访问这些方法。具体步骤如下： 1. 创建`WebView`对象时，初始化`WebViewClient`或`WebChromeClient`： ```java WebView webView = findViewById(R.id.web_view); webView.setWebViewClient(new WebViewClient() { @Override public boolean shouldOverrideUrlLoading(WebView view, String url) { return super.shouldOverrideUrlLoading(view, url); } @JavascriptInterface public void callFromJS(Person person) { // 在这里处理JavaScript调用并传递给Java对象 } }); ``` 2. 使用`addJavascriptInterface()`添加JavaScript接口： ```java webView.addJavascriptInterface(person, "person"); ``` 这样，JavaScript可以通过`window.person`对象访问`Person`实例的方法了。例如，在JavaScript代码中调用`callJS()`函数时，就会触发`callFromJS()`方法，从而实现了Java对象和列表的传递。 要在WebView中实现Java对象与JavaScript的交互，关键在于正确地声明Java对象并将其暴露给JavaScript，同时确保JavaScript函数能够正确地接收和处理这些对象。这一步骤对于构建动态和响应式的混合应用至关重要。