Android 11中HTML的src属性无法正常工作如何解决？

核心原因 #

Android端WebView对本地资源的路径解析、权限限制和PC浏览器存在差异，导致相对路径无法正确识别，或资源访问被拦截。

具体解决方案 #

• 修正本地资源路径
  如果你的HTML和资源文件放在Android项目的assets目录下：

  • 加载HTML时使用file:///android_asset/前缀，比如webView.loadUrl("file:///android_asset/index.html")
  • 资源的相对路径需基于assets根目录，例如图片路径写成<img src="img.png">（前提是img.png直接放在assets下），如果资源在子文件夹则写成<img src="images/img.png">
  • 也可以直接使用绝对路径：<img src="file:///android_asset/img.png">

  如果资源在外部存储（比如SD卡）：

  • 使用外部存储的绝对路径前缀file:///storage/emulated/0/，例如<img src="file:///storage/emulated/0/MyApp/img.png">，注意要申请READ_EXTERNAL_STORAGE权限（Android 10及以上需适配分区存储，或在Manifest中添加android:requestLegacyExternalStorage="true"）

• 配置WebView的必要权限与设置
  在初始化WebView时添加以下设置，确保资源和脚本能正常加载：

  WebSettings settings = webView.getSettings();
  // 允许文件访问
  settings.setAllowFileAccess(true);
  // 开启JavaScript支持（加载外部脚本必备）
  settings.setJavaScriptEnabled(true);
  // 允许file://协议加载的页面访问其他file://资源（iframe、跨目录脚本需要）
  settings.setAllowUniversalAccessFromFileURLs(true);
  // Android 11+ 需允许访问媒体资源
  settings.setAllowContentAccess(true);
  

• 排查资源实际位置
  确认资源文件（img.png、脚本、iframe目标HTML）的实际存放路径和HTML文件的路径层级匹配：

  • PC端测试时的路径结构要和Android端保持一致，避免PC上资源在根目录，Android上却放在子文件夹的情况
  • 检查Android打包时资源是否被正确打包到APK的assets或指定目录，没有被遗漏或路径错误

注意事项 #

• setAllowUniversalAccessFromFileURLs(true)会带来一定安全风险，正式上线前需评估是否必要，或通过其他方式隔离资源
• Android 10及以上的分区存储限制，建议将应用私有资源放在getExternalFilesDir()目录下，避免权限问题

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