H5 端 加载到WebView 中调用文件选择器（如 uni.chooseFile）时，系统只弹出“相机”

H5 端 加载到WebView 中调用文件选择器（如 uni.chooseFile）时，系统只弹出“相机”

开发环境 版本号 项目创建方式
Mac 10.15.7 HBuilderX 
产品分类：uniapp/App

PC开发环境操作系统：Mac

PC开发环境操作系统版本号：10.15.7

HBuilderX类型：正式

HBuilderX版本号：4.75

手机系统：Android

手机系统版本号：Android 15

手机厂商：vivo

手机机型：vivo12

页面类型：vue

vue版本：vue2

打包方式：云端

项目创建方式：HBuilderX

### 示例代码：

H5页面index.html
```html
<uni-section title="选择任意文件" type="line">
<view class="example-body">
<uni-file-picker limit="5" file-mediatype="all" title="最多选择5个文件"></uni-file-picker>
</view>
</uni-section>

app页面

<web-view src="index.html" [@message](/user/message)="getMessage"></web-view>

操作步骤：

点击选择文件

预期结果：

能选择手机中的任意文件

实际结果：

只能拍照

bug描述：

我有一个uniapp实现的H5页面，里面需要实现选择文件上传的功能，我先后采用了uni-file-picker和uni-chooseFile两种方式，单独在浏览器中访问这个页面时是正常能选取手机文件的，当通过web-view组件加载到app中的时候，点击上传文件功能按钮时，系统只弹出“相机”选择操作框


1 回复

在 H5 页面通过 WebView 嵌入 App 时，调用 uni.chooseFile 或使用 uni-file-picker 组件出现仅弹出相机选项的问题，通常是由于 WebView 环境下的权限限制或配置缺失导致的。以下是关键原因和解决方案：

  1. WebView 默认行为限制
    Android 系统的 WebView 在默认情况下可能仅允许访问相机，而非完整的文件系统。需在 App 端配置 WebView 以启用文件选择功能。

  2. 缺少文件访问权限
    确保 App 已申请并授予以下权限（在 manifest.json 中配置）：

    {
  "android": {
    "permissions": ["READ_EXTERNAL_STORAGE", "WRITE_EXTERNAL_STORAGE"]
  }
}

    若使用 Android 11（API 30）或更高版本，需在 src/main/AndroidManifest.xml 中添加 <uses-permission> 标签并适配分区存储（Scoped Storage）。

  3. WebView 初始化配置
    在 App 端创建 WebView 时，需显式设置文件选择支持。例如，在原生开发中需重写 WebChromeClient 的 onShowFileChooser 方法。uni-app 的 web-view 组件需通过 @message 事件与 H5 页面通信，触发原生文件选择器。

  4. H5 页面参数调整
    在 uni.chooseFile 或 uni-file-picker 中指定 fileMediatype 为 'all' 可能因 WebView 限制失效。可尝试分类型选择：

    // 优先尝试指定 image/video 等类型
uni.chooseFile({
  count: 5,
  type: 'image',
  success: (res) => console.log(res)
});
回到顶部