Cordova - 解决Android11下img标签无法加载手机本地路径图片问题(file:///)
1,问题描述
(1)之前有一个 Android 老项目,使用的是 Cordova + Vue 开发的。原先通过 cordova-plugin-camera 插件拍照或者选择照片后,将返回的 imageURI 直接设置到页面 img 标签的 src 属性上是可以显示的。
返回的 imageURI 为类似如下以 file:/// 开头的本地存储路径:
- file:///storage/emulated/0/Android/data/com.hangge.app/cache/weather.png?1646982378851
(2)最近为了支持 Android11 手机,将 build.gradle 的 targetSdkVersion 改成了 30。打包测试,发现拍照或者选择照片功能是正常的,但是就是无法成功回显。
2,问题原因
官方出于安全考虑,不推荐在 webview 访问文件地址。因此 Andorid 11 以及以上版本,我们需要手动设置 setAllowFileAccess 为 true 允许 webview 对文件的操作。
提示:在 Android 10(Build.VERSION_CODES.Q)及以下版本,这个值默认是为 true 的,所以我们不用特别去设置。不过到了 Android 11(Build.VERSION_CODES.R) 这个值默认为 false,因此就出现了访问问题。
3,解决办法
修改项目的 SystemWebViewEngine.java 文件,添加如下设置即可:
settings.setAllowFileAccess(true);