Get the path of a file uploaded on Flutter Web

Question

The main problem I'm facing is this (on the Web platform):

I'm developing an app for Android and Web platform with Flutter. I manage to upload a file (image of a QR Code), but I'm using qr_code_tools plugin, and I need to provide a file path like this:

resultDecodeStr = await QrCodeToolsPlugin.decodeFrom(path);

This the code of how to upload the image file (on the web platform):

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];
}

The returned file object have a property "relativePath" which is empty.

On Android I use something similar, but it does have a path, and if don't, I can get a temp directory (with path_provider) and create a new File (with dart.Io). But this is not possible for the web, both plugins (path_provider and dart Io) have no compatibility...

Please I would appreciate some help...

Answer 1

Using the library you provided, it does not look like it is possible to do what you want. Uploading files to the web is different than on a device because you get a copy of an dart:html File that has different restrictions/properties than a dart:io File. After looking at that library, it does not look like it supports decoding from bytes (and only from a path), which you cannot do due to how browsers' security works (you cannot access the file-system, but there is a possibility of this in the future). To work in the browser, it should allow for decoding from bytes (because you can read the bytes of a dart:html File). See also: Local file access with JavaScript

Consequently, you will either have to fork the library and make your own from-bytes decoder or use a different library altogether for web support.