Flutter WebView无法实现文件下载与上传功能求助

问题现状 #

• .NET项目中集成的Flutter WebView，核心功能正常，但文件、图片的上传和下载功能完全失效
• 已在AndroidManifest.xml中添加读取存储权限：

  <uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE" />
  

解决步骤 #

1. 补全必要权限 #

仅添加读取权限不足以支持文件交互，需根据Android版本补充对应权限：

<!-- Android 10及以下需写入存储权限 -->
<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />
<!-- Android 11+ 需添加存储管理权限 -->
<uses-permission android:name="android.permission.MANAGE_EXTERNAL_STORAGE" />
<!-- Android 13+ 用此权限替代旧的读取存储权限 -->
<uses-permission android:name="android.permission.READ_MEDIA_IMAGES" />

注意：Android 6.0+系统必须动态申请权限，仅在Manifest中声明无效，可借助permission_handler插件在代码中请求用户授权。

2. 配置WebView文件处理逻辑 #

WebView默认未开启完整的文件交互能力，需修改WebChromeClient和导航代理：

WebView(
  initialUrl: "你的网页地址",
  javascriptMode: JavascriptMode.unrestricted,
  webChromeClient: WebChromeClient(
    // 处理文件上传选择
    @override
    void onShowFileChooser(
      WebViewController controller,
      ValueChanged<List<XFile>> filePathCallback,
      FileChooserParams params,
    ) {
      // 可使用file_picker插件调用系统文件选择器，将选中文件回传给WebView
      // 示例伪代码：
      // FilePicker.platform.pickFiles().then((result) {
      //   if (result != null) {
      //     filePathCallback(result.paths.map((path) => XFile(path!)).toList());
      //   }
      // });
      return super.onShowFileChooser(controller, filePathCallback, params);
    }
  ),
  navigationDelegate: (NavigationRequest request) {
    // 拦截下载链接，用flutter_downloader插件处理下载逻辑
    if (request.url.contains(".pdf") || request.url.contains(".jpg") || request.url.contains(".png")) {
      // 调用下载逻辑示例：
      // FlutterDownloader.enqueue(
      //   url: request.url,
      //   savedDir: (await getExternalStorageDirectory())!.path,
      //   showNotification: true,
      // );
      return NavigationDecision.prevent; // 阻止WebView默认处理
    }
    return NavigationDecision.navigate;
  },
)

3. 检查.NET后端适配 #

若问题源于后端，需确认两点：

• 上传接口支持multipart/form-data格式，能正确接收文件数据
• 下载接口响应头需包含Content-Disposition字段，示例.NET代码：

var fileContent = System.IO.File.ReadAllBytes("服务器文件路径");
Response.Headers.Add("Content-Disposition", $"attachment; filename=\"{Path.GetFileName("服务器文件路径")}\"");
return File(fileContent, "application/octet-stream");

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