uni-app 安卓 webview 载入h5项目 上传图片选择相册没有反应

uni-app 安卓 webview 载入h5项目 上传图片选择相册没有反应

开发环境 版本号 项目创建方式
Windows 10 HBuilderX

操作步骤：

  1. plus.webview.create
  2. webview.loadURL(url)
  3. h5项目选择上传图片input type=file
  4. 选择相册

预期结果：

正常选择图片，能拿到图片有回调信息

实际结果：

选择完相册图片没有反应

bug描述：

webview 载入h5项目 上传图片是选择相册没有动态获取权限，会导致选择图片后没有反应，选择摄像头就可以弹出授权提示

App下载地址或H5网址


更多关于uni-app 安卓 webview 载入h5项目 上传图片选择相册没有反应的实战教程也可以访问 https://www.itying.com/category-93-b0.html

1 回复

更多关于uni-app 安卓 webview 载入h5项目 上传图片选择相册没有反应的实战教程也可以访问 https://www.itying.com/category-93-b0.html


这是一个典型的 Android WebView 文件选择权限问题。在 uni-app 的 WebView 组件中，H5 页面通过 input[type=file] 调用相册时，需要额外的权限配置才能正常响应。

核心解决方案：

  1. 配置 Android 权限 在 manifest.json 中确保已声明文件读写权限：

    {
  "permissions": {
    "Android": [
      "<uses-permission android:name=\"android.permission.READ_EXTERNAL_STORAGE\"/>",
      "<uses-permission android:name=\"android.permission.WRITE_EXTERNAL_STORAGE\"/>"
    ]
  }
}

  2. 动态权限申请 在调用 WebView 前，通过 uni-app 的权限 API 动态申请存储权限：

    uni.authorize({
  scope: 'scope.writePhotosAlbum',
  success: () => {
    // 创建 WebView
    const wv = plus.webview.create(url);
  }
});

  3. WebView 配置优化 创建 WebView 时启用文件访问：

    const wv = plus.webview.create(url, '', {
  additionalHttpHeaders: {},
  fileAccess: true
});

  4. H5 页面适配 确保 H5 页面的 input 元素包含 accept 属性：

    <input type="file" accept="image/*">
回到顶部