Android WebView加载本地CSS与JS文件问题求最新解决方案

嘿，我懂你翻了一堆6年前的老答案却解决不了问题的郁闷，下面给你分享适配近年Android版本的可行方案，完美对应你的场景——文件都存在app/assets/Content/目录下：

一、先把WebView基础配置拉满 #

首先得确保WebView允许加载本地资源和执行JS，这是所有操作的前提，直接上代码：

WebView webView = findViewById(R.id.your_webview_id);
WebSettings webSettings = webView.getSettings();

// 允许JS执行（如果你的业务需要JS运行的话）
webSettings.setJavaScriptEnabled(true);
// 允许访问本地文件
webSettings.setAllowFileAccess(true);
// 关键！允许从本地HTML页面加载同目录的其他文件（CSS/JS全靠这个）
webSettings.setAllowFileAccessFromFileURLs(true);
// 适配Android高版本，允许通用本地资源访问
webSettings.setAllowUniversalAccessFromFileURLs(true);
// 开启DOM存储（很多JS功能需要这个支持）
webSettings.setDomStorageEnabled(true);

二、正确加载assets里的HTML文件 #

你的HTML在app/assets/Content/下，直接用file:///android_asset/前缀拼接路径就行，调用loadUrl加载：

webView.loadUrl("file:///android_asset/Content/file.html");

三、HTML里的资源路径处理 #

你现在的HTML里用的是相对路径：

<link href="stylesheet.css" type="text/css" rel="stylesheet">
<script src="myscript.js"></script>

这个写法没问题！因为HTML本身是从Content/目录加载的，相对路径会自动指向同目录，只要前面的WebView配置正确，CSS和JS就能正常加载。如果还是出问题，也可以改成绝对的asset路径试试：

<link href="file:///android_asset/Content/stylesheet.css" type="text/css" rel="stylesheet">
<script src="file:///android_asset/Content/myscript.js"></script>

四、适配Android 11+的小细节 #

如果你的应用针对Android 11（API 30）及以上版本，不用担心外部存储权限的问题——assets目录是应用内部资源，不需要额外申请权限。不过可以加个WebViewClient来调试加载情况，方便排查问题：

webView.setWebViewClient(new WebViewClient() {
    @Override
    public void onReceivedError(WebView view, WebResourceRequest request, WebResourceError error) {
        super.onReceivedError(view, request, error);
        // 打印错误信息，快速定位哪个资源加载失败
        Log.e("WebViewDebug", "加载失败的资源: " + request.getUrl().toString());
    }
});

五、常见坑点排查 #

• 文件名和路径一定要注意大小写！Android的assets目录对大小写敏感，比如Stylesheet.css和stylesheet.css会被当成两个文件。
• 确认AllowFileAccessFromFileURLs已经开启，这个是同目录资源加载的核心开关，没开的话CSS/JS肯定加载失败。
• 如果是Android 12+，检查是否有其他WebView安全配置限制，可以暂时关闭setSafeBrowsingEnabled(false)试试（调试用，正式版按需开启）。

内容的提问来源于stack exchange，提问作者Paradox