获取Flutter Web上传文件的路径答案

【问题标题】：Get the path of a file uploaded on Flutter Web获取Flutter Web上传文件的路径
【发布时间】：2020-09-22 10:53:03
【问题描述】：

我面临的主要问题是这个（在网络平台上）：

我正在使用 Flutter 开发适用于 Android 和 Web 平台的应用程序。我设法上传了一个文件（二维码的图像），但我使用的是 qr_code_tools 插件，我需要提供这样的文件路径：

resultDecodeStr = await QrCodeToolsPlugin.decodeFrom(path);

这是如何上传图片文件的代码（在网络平台上）：

Future<File> pickFile() async {
   final Map<String, dynamic> data = {};
   final FileUploadInputElement input = FileUploadInputElement();
   input..accept = 'image/*';
   input.click();
   await input.onChange.first;
   if (input.files.isEmpty) return null;
   return input.files[0];
}

返回的文件对象有一个属性“relativePath”，它是空的。

在 Android 上我使用类似的东西，但它确实有一个路径，如果没有，我可以获取一个临时目录（使用 path_provider）并创建一个新文件（使用 dart.Io）。但这对 web 来说是不可能的，两个插件（path_provider 和 dart Io）都没有兼容性......

请多多帮助...

【问题讨论】：

将文件上传到 Web 与在设备上不同，因为您获得的 dart:html 文件的副本与 dart:io 文件具有不同的限制/属性。但是，您可以将网络中上传的文件转换为其字节，然后将其传递给您的库，假设它支持直接读取图像字节。
在快速浏览库之后，您似乎无法从字节解码（但也许我从该库的文档中遗漏了一些东西？）。因此，假设您需要网络支持，您要么必须自己修改它，要么使用不同的库。

标签： flutter flutter-web

【解决方案1】：

使用您提供的库，看起来不可能做您想做的事。将文件上传到 Web 与在设备上不同，因为您会获得 dart:html 文件的副本，该文件具有与 dart:io 文件不同的限制/属性。查看该库后，它似乎不支持从字节解码（并且仅从路径解码），由于浏览器的安全性如何工作（您无法访问文件系统，but there is a possibility of this in the future），您无法做到这一点。要在浏览器中工作，它应该允许从字节解码（因为您可以读取 dart:html 文件的字节）。另见：Local file access with JavaScript

因此，您要么必须分叉库并制作自己的 from-bytes 解码器，要么完全使用不同的库来提供 Web 支持。

【讨论】：