当前位置：首页 > 行业动态 > 正文

Android JS互传对象机制详解与实现疑问

admin
行业动态
2025-03-08
4

在 Android 中，JavaScript 可以通过 WebView 与 Java 进行交互。你可以使用 WebView 的 addJavascriptInterface 方法来传递对象，从而让 JavaScript 调用 Java 的方法。

1、Android接收JS传递的对象

JavaScript端：在JavaScript中创建一个对象，并通过window.androidInterface.passObject(JSON.stringify(myObject))将这个对象传递给Android，创建一个包含姓名和年龄的对象var myObject = {name: 'John', age: 30};，然后将其转换为JSON字符串并传递给Android。

Android端：需要在Android的Activity中通过addJavascriptInterface方法将一个Java对象暴露给JavaScript，以便JavaScript可以调用该Java对象的方法，创建一个名为MyJavaScriptInterface的类，并在其中定义一个@JavascriptInterface注解的方法passObject，用于接收JavaScript传递的对象，然后在onCreate方法中，将MyJavaScriptInterface的实例传递给WebView。

完整示例：JavaScript代码如下：

 <!DOCTYPE html>
      <html>
      <head>
          <title>Pass Object to Android</title>
      </head>
      <body>
          <button onclick="passObjectToAndroid()">Pass Object</button>
          <script>
              function passObjectToAndroid() {
                  var myObject = {
                      name: 'Alice',
                      age: 25
                  };
                  window.androidInterface.passObject(JSON.stringify(myObject));
              }
          </script>
      </body>
      </html>

Android代码如下：

 public class MainActivity extends AppCompatActivity {
          @Override
          protected void onCreate(Bundle savedInstanceState) {
              super.onCreate(savedInstanceState);
              setContentView(R.layout.activity_main);
              WebView webView = findViewById(R.id.webview);
              webView.getSettings().setJavaScriptEnabled(true);
              webView.addJavascriptInterface(new MyJavaScriptInterface(), "androidInterface");
              webView.loadUrl("file:///android_asset/index.html");
          }
          public class MyJavaScriptInterface {
              @JavascriptInterface
              public void passObject(String objectJson) {
                  try {
                      JSONObject jsonObject = new JSONObject(objectJson);
                      String name = jsonObject.getString("name");
                      int age = jsonObject.getInt("age");
                      Log.d("MyObject", "Name: " + name + ", Age: " + age);
                  } catch (JSONException e) {
                      e.printStackTrace();
                  }
              }
          }
      }

2、Android向JS传递对象

Android JS互传对象机制详解与实现疑问

Android端：在Android中创建一个对象，并将其转换为JSON格式，可以使用Gson库来轻松解析JSON，创建一个包含姓名、年龄和爱好的用户类User，然后创建一个User对象并使用Gson库将其转换为JSON字符串。

JavaScript端：在JavaScript中编写一个方法，用于接收并处理传递的Java对象，定义一个receiveData方法，用于接收Android传递的对象。

完整示例：HTML代码如下：

 <!DOCTYPE html>
      <html lang="en">
      <head>
          <meta charset="UTF-8">
          <title>JavaScript to Android</title>
      </head>
      <body>
          <script>
              function sendObjectToAndroid() {
                  const data = {
                      name: 'John Doe',
                      age: 30,
                      hobbies: ['reading', 'traveling', 'coding']
                  };
                  const jsonData = JSON.stringify(data);
                  Android.receiveData(jsonData);
              }
              window.onload = function() {
                  sendObjectToAndroid();
              };
          </script>
      </body>
      </html>

Android代码如下：

Android JS互传对象机制详解与实现疑问

 public class MainActivity extends AppCompatActivity {
          private WebView webView;
          @Override
          protected void onCreate(Bundle savedInstanceState) {
              super.onCreate(savedInstanceState);
              setContentView(R.layout.activity_main);
              webView = findViewById(R.id.webView);
              webView.getSettings().setJavaScriptEnabled(true);
              webView.addJavascriptInterface(new WebAppInterface(this), "Android");
              webView.loadUrl("file:///android_asset/sample.html");
          }
          public class WebAppInterface {
              Context mContext;
              WebAppInterface(Context c) {
                  mContext = c;
              }
              @JavascriptInterface
              public void receiveData(String jsonData) {
                  Gson gson = new Gson();
                  User user = gson.fromJson(jsonData, User.class);
                  Log.d("WebData", "Name: " + user.name + ", Age: " + user.age);
              }
          }
      }