Android和js的交互

本文详细介绍了Android调用JavaScript的两种方法:loadUrl和evaluateJavascript,对比了它们的优缺点。对于JS调用Android,文章列举了通过addJavascriptInterface、shouldOverrideUrlLoading以及onJsPrompt的实现方式,并分析了各自的适用场景。重点讨论了在实际应用中如何选择合适的方法进行交互,以及兼容性和效率的考量。

Android调用js两种方法:

  1. 通过webview的loadURL方法,如果调用js方法的话,通过
    webview.loadUrl(“javascript:jsFun()”);如果该方法有参数,直接将参数拼接进去即可,比如webView.loadUrl(“javascript:jsFun(”+ msg + “)”); 但是这种方法的调用方式,每次都会刷新页面。
  2. 通过WebView的evaluate(阿外力维特)Javascript(),这种方法调用js后,可以直接拿到js返回的结果,而且不会每次刷新页面,效率较高,但是版本兼容性较差,只支持Android4.4以上的手机,但现在4.4以下的手机基本很少了,如果用户群体设备基本在Android4.4以上的话,优先推荐这种方法。

Js调用Android的三种方法:

  1. 通过WebView的addJavascriptInterface()进行映射,被js调用的方法必须加@JavascriptInterface注解
  2. 通过 WebViewClient 的shouldOverrideUrlLoading ()方法回调拦截
    url,然后解析该URL的协议,如果检测到是预先约定好的交互协议,就调用相应方法,这种方法js不能接受到Android方法的返回值。
  3. 通过 WebChromeClient的onJsAlert()、onJsConfirm()、onJsPrompt()方法回调拦截JS对话框alert()、confirm()、prompt()
    消息,然后解析消息内容,其实这个方法和第二个差不多,最常用的就是通过拦截js的提示框prompt()方法,因为onJSPrompt调用较少,而且可以返回任意类型的值,操作方便灵活,而alert()对话框没有返回值,confirm()对话框只能返回确认和取消两种状态。
Android 应用中,如果需要与 WebView 中加载的网页进行交互,尤其是与 JavaScript 进行双向通信,可以使用 Android 提供的 `WebView` `addJavascriptInterface` 方法实现 Java 与 JavaScript 的交互。 --- ### 示例:Android 与 JavaScript 交互 #### 1. 布局文件 `activity_main.xml` ```xml <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical"> <WebView android:id="@+id/webview" android:layout_width="match_parent" android:layout_height="match_parent" /> </LinearLayout> ``` #### 2. Java 代码 `MainActivity.java` ```java package com.example.androidjs; import android.os.Bundle; import android.webkit.JavascriptInterface; import android.webkit.WebSettings; import android.webkit.WebView; import android.widget.Toast; import androidx.appcompat.app.AppCompatActivity; 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); WebSettings webSettings = webView.getSettings(); webSettings.setJavaScriptEnabled(true); // 启用 JavaScript // 添加 JavaScript 接口 webView.addJavascriptInterface(new WebAppInterface(), "Android"); // 加载本地 HTML 文件(放在 assets 目录下) webView.loadUrl("file:///android_asset/index.html"); } // 定义一个类,用于暴露给 JS 调用 public class WebAppInterface { @JavascriptInterface public void showToast(String message) { Toast.makeText(getApplicationContext(), message, Toast.LENGTH_SHORT).show(); } @JavascriptInterface public String getMessageFromAndroid() { return "Hello from Android!"; } } } ``` #### 3. HTML 文件 `index.html`(放在 `assets` 目录下) ```html <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Android JS Interaction</title> <script type="text/javascript"> function callAndroidToast() { Android.showToast("Hello from JavaScript!"); } function getAndroidMessage() { var message = Android.getMessageFromAndroid(); document.getElementById("output").innerText = message; } </script> </head> <body> <h1>Android - JavaScript 交互示例</h1> <button onclick="callAndroidToast()">点击调用 Android 的 Toast</button> <br><br> <button onclick="getAndroidMessage()">获取 Android 的消息</button> <p id="output"></p> </body> </html> ``` --- ### 代码解释 1. **启用 JavaScript**: - 在 `WebView` 中启用 JavaScript 是交互的前提。 - 使用 `webSettings.setJavaScriptEnabled(true);` 2. **添加 JavaScript 接口**: - 使用 `addJavascriptInterface()` 方法将 Java 对象暴露给 JavaScript。 - 本例中将 `WebAppInterface` 类暴露为 `Android` 对象,JavaScript 可以通过 `Android.showToast()` `Android.getMessageFromAndroid()` 调用。 3. **JavaScript 调用 Java 方法**: - 在 HTML 文件中,JavaScript 可以直接调用 `Android.showToast("message")` 来触发 Android 的 `Toast`。 4. **Java 调用 JavaScript 方法**: - 如果你需要从 Android 主动调用 JavaScript 方法,可以使用 `webView.evaluateJavascript()` 方法: ```java webView.evaluateJavascript("javascript:document.getElementById('output').innerText = 'Updated from Android'", null); ``` --- ### 注意事项 - **安全问题**:从 Android 4.2(API 17)开始,`@JavascriptInterface` 注解是必须的,否则 JS 无法访问 Java 方法。 - **线程问题**:JS 调用 Java 方法是在主线程中执行的,不能执行耗时操作。 - **权限问题**:如果加载的是网络资源,确保在 `AndroidManifest.xml` 中添加网络权限: ```xml <uses-permission android:name="android.permission.INTERNET" /> ``` --- ###
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值