JavaScript 和原生 Android通信

在 Android WebView 中,JavaScript 和原生 Android 代码可以通过以下几种方式进行通信:


1. 通过 addJavascriptInterface 实现双向通信

Android 提供了 addJavascriptInterface 方法,可以将 Java 对象注入到 WebView 中,供 JavaScript 调用。

步骤:
  1. 在 Android 中创建 Java 对象
    创建一个 Java 类,定义需要暴露给 JavaScript 的方法,并使用 @JavascriptInterface 注解标记这些方法。

    public class WebAppInterface {
        Context mContext;
    
        WebAppInterface(Context context) {
            mContext = context;
        }
    
        @JavascriptInterface
        public void showToast(String message) {
            Toast.makeText(mContext, message, Toast.LENGTH_SHORT).show();
        }
    }
    
  2. 将 Java 对象注入 WebView
    在 WebView 中调用 addJavascriptInterface 方法,将 Java 对象注入到 JavaScript 环境中。

    WebView webView = findViewById(R.id.webview);
    webView.getSettings().setJavaScriptEnabled(true);
    webView.addJavascriptInterface(new WebAppInterface(this), "Android");
    
  3. 在 JavaScript 中调用 Android 方法
    在 JavaScript 中,可以通过注入的对象名(如 Android)调用 Java 方法。

    // 调用 Android 的 showToast 方法
    Android.showToast("Hello from JavaScript!");
    

2. 通过 evaluateJavascript 实现 Android 调用 JavaScript

Android 可以通过 evaluateJavascript 方法调用 WebView 中的 JavaScript 函数。

步骤:
  1. 在 JavaScript 中定义函数
    在 HTML 页面中定义一个 JavaScript 函数。

    <script>
        function showMessage(message) {
            alert("Message from Android: " + message);
        }
    </script>
    
  2. 在 Android 中调用 JavaScript 函数
    使用 evaluateJavascript 方法调用 JavaScript 函数。

    webView.evaluateJavascript("javascript:showMessage('Hello from Android!')", null);
    

3. 通过 WebViewClient 拦截 URL 实现通信

可以通过自定义 WebViewClient 拦截特定的 URL 来实现通信。

步骤:
  1. 在 JavaScript 中触发 URL 跳转
    在 JavaScript 中通过 window.location.hrefiframe 跳转到一个特定的 URL。

    function sendMessageToAndroid(message) {
        window.location.href = "js://webview?message=" + encodeURIComponent(message);
    }
    
  2. 在 Android 中拦截 URL
    WebViewClient 中重写 shouldOverrideUrlLoading 方法,解析 URL 并处理消息。

    webView.setWebViewClient(new WebViewClient() {
        @Override
        public boolean shouldOverrideUrlLoading(WebView view, String url) {
            if (url.startsWith("js://webview")) {
                // 解析 URL 中的消息
                String message = url.split("message=")[1];
                Toast.makeText(MainActivity.this, message, Toast.LENGTH_SHORT).show();
                return true; // 拦截 URL
            }
            return super.shouldOverrideUrlLoading(view, url);
        }
    });
    

4. 通过 WebChromeClient 拦截 JavaScript 弹窗

可以通过 WebChromeClient 拦截 JavaScript 的 alertconfirmprompt 弹窗,实现通信。

步骤:
  1. 在 JavaScript 中触发弹窗
    在 JavaScript 中调用 alertconfirmprompt

    alert("Hello from JavaScript!");
    
  2. 在 Android 中拦截弹窗
    WebChromeClient 中重写 onJsAlertonJsConfirmonJsPrompt 方法。

    webView.setWebChromeClient(new WebChromeClient() {
        @Override
        public boolean onJsAlert(WebView view, String url, String message, JsResult result) {
            Toast.makeText(MainActivity.this, message, Toast.LENGTH_SHORT).show();
            result.confirm(); // 处理弹窗
            return true; // 拦截弹窗
        }
    });
    

5. 通过 postMessage 实现双向通信

Android WebView 支持 HTML5 的 postMessage API,可以实现更安全的双向通信。

步骤:
  1. 在 JavaScript 中发送消息
    使用 postMessage 向 Android 发送消息。

    window.postMessage("Hello from JavaScript!", "*");
    
  2. 在 Android 中接收消息
    在 Android 中通过 evaluateJavascript 监听 message 事件。

    webView.setWebViewClient(new WebViewClient() {
        @Override
        public void onPageFinished(WebView view, String url) {
            super.onPageFinished(view, url);
            // 注入 JavaScript 代码以监听消息
            webView.evaluateJavascript(
                "window.addEventListener('message', function(event) { " +
                "   Android.onMessage(event.data); " +
                "});", null);
        }
    });
    
  3. 在 Android 中处理消息
    在 Java 中定义 onMessage 方法。

    @JavascriptInterface
    public void onMessage(String message) {
        Toast.makeText(this, message, Toast.LENGTH_SHORT).show();
    }
    

总结

方法优点缺点
addJavascriptInterface简单易用,支持双向通信安全性较低(需注意漏洞)
evaluateJavascriptAndroid 调用 JavaScript 方便仅支持单向通信
拦截 URL兼容性好,适合简单场景URL 长度有限,不适合复杂数据
拦截弹窗兼容性好,适合简单场景仅支持单向通信
postMessage安全性高,支持复杂数据实现稍复杂

根据具体需求选择合适的方式实现通信!

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值