Android使用webview加载html

最新推荐文章于 2026-05-17 06:45:46 发布

原创最新推荐文章于 2026-05-17 06:45:46 发布 · 4.7k 阅读

1 ·

本内容遵循CC 4.0 BY-SA版权协议

标签

#android #webview #html

本文介绍了如何在Android应用中使用WebView加载本地HTML，设置JavaScript交互，并启用调试功能。通过设置WebView参数，解决了文件路径访问和跨域问题。同时，详细阐述了Android调用JavaScript代码以及JavaScript调用Android方法的实现方式。此外，还提供了Chrome远程调试Android端WebView中的JS的方法，以助于开发者进行更有效的调试。

Android通过webview加载本地html

使用

1.加载Android本地目录asset文件下的html:
2.设置可调用Javascript；
3.设置可调试；
4.js中文件路径无法访问，需要打开setAllowFileAccessFromFileURLs，解决跨域问题；

        show_web.setWebContentsDebuggingEnabled(true);
        show_web.getSettings().setJavaScriptEnabled(true);
        show_web.getSettings().setAllowFileAccessFromFileURLs(true);
        show_web.setWebViewClient(new WebViewClient());
        show_web.loadUrl("file:///android_asset/index.html");

Chrome远程调试Android端webview中的js

Android端需设置可调试
Chrome下查看：chrome://inspect/#devices

在这里插入图片描述

点击相关手机设备HTML，打开即可调试；
如果白屏，无法加载成功，需要连接上VPN再打开；

Android端调用js代码

   mWebView.loadUrl("javascript:funFromjs()");

js端调用Android代码

mWebView.addJavascriptInterface(new JavaScriptObject(mContext), "myObj");  
        
public class JavaScriptObject {  

    Context mContxt;  

    @JavascriptInterface //sdk17版本以上加上注解  
    public JavaScriptObject(Context mContxt) {  
        this.mContxt = mContxt;  
    }  

    public void fun1FromAndroid(String name) {  
        Toast.makeText(mContxt, name, Toast.LENGTH_LONG).show();  
    }  
    public void fun2(String name) {  
        Toast.makeText(mContxt, "调用fun2:" + name, Toast.LENGTH_SHORT).show();  
    }  
}