Flutter Web: File Picker throws 'Invalid argument(s) (path): Must not be null' error

Issue

Objective: Select a file using file explorer and upload to firebase storage.

Package: file_picker: ^2.1.4

Issue: Throws error: "Invalid argument(s) (path): Must not be null".

The file explorer opens fine and I am able to select a file. However, nothing happens after I select a file. Below is the code I have tried so far:

FilePickerResult result;
File uploadfile;

try{
    result = await FilePicker.platform.pickFiles(type: FileType.custom,
          allowedExtensions: ['jpg', 'pdf', 'doc', 'docx', 'xls', 'xlsx', 'txt'],
        );
} catch(e) { 
    print(e);
}

if(result != null) {
     
    try{
          uploadfile = File(result.files.single.path);
 
          String filename = basename(uploadfile.path);
 
          StorageReference storageRef = FirebaseStorage.instance.ref().child('$path$filename');
 
          final StorageUploadTask uploadTask = storageRef.putFile(uploadfile);
 
          final StorageTaskSnapshot downloadUrl = (await uploadTask.onComplete);
 
          if (downloadUrl.error == null){
 
            final String attchurl = (await downloadUrl.ref.getDownloadURL());
 
          }
    } catch(e) {
       print(e);
    }

I am sure that the code throws error at : uploadfile = File(result.files.single.path);

I’ve tried various suggestions provided in multiple blogs. Even the solution here does not help, I get the same error. See code below:

  FilePickerResult _filePickerResult;
  File uploadfile;
  try {
        _filePickerResult = await FilePicker.platform.pickFiles(
            type: FileType.custom,
           allowedExtensions: ['jpg', 'pdf', 'doc', 'docx', 'xls', 'xlsx', 'txt'],);
      } on PlatformException catch (e) {
        print("Unsupported operation" + e.toString());
      }

      if (_filePickerResult != null) {
        try{
          uploadfile = File(_filePickerResult.files.single.path);

          print(uploadfile);
        }catch(e){
          print(e);
        }
        
  }

Any help will be highly appreciated. Thanks!

*** UPDATE ***

When I do:

print(result);
print(result.files);
print(result.files.single);
print(result.files.single.name);
print(result.files.single.size);
print(result.files.single.path);

I get:

Instance of 'FilePickerResult'
[Instance of 'PlatformFile']
Instance of 'PlatformFile'
FileName01.xlsx
10
null

So essentially, result.files.single.path is failing. Hope this helps. Thanks!

Solution

I may have solved this one…

Apparently, path is always null when using web, according to the file_picker wiki.
They recommend to use bytes instead to retrieve the file data.

So, following the above instructions and a little bit of tinkering, I was able to upload the file successfully. The modified code now looks like this:

FilePickerResult result;

  try{
    result = await FilePicker.platform.pickFiles(type: FileType.custom,
          allowedExtensions: ['jpg', 'pdf', 'doc', 'docx', 'xls', 'xlsx', 'txt'],
        );
  } catch(e)
  { print(e);
    }

      if(result != null) {
        try{

          Uint8List uploadfile = result.files.single.bytes;
        
          String filename = basename(result.files.single.name);
          
          fs.Reference storageRef = fs.FirebaseStorage.instance.ref().child('$dirpath$filename');
          
          final fs.UploadTask uploadTask = storageRef.putData(uploadfile);
          
          final fs.TaskSnapshot downloadUrl = await uploadTask;
          
          final String attchurl = (await downloadUrl.ref.getDownloadURL());
          
          await AttachmentService(orgid: orgID, orgname: orgName, projid: projID).addattachmentobjs(objType, objID, attchdate, filename, attchurl);
          
      }catch(e) {
          print(e);
        }

      }

Basically, I just changed:

FilePickerResult uploadfile = File(result.files.single.path);

to:

Uint8List uploadfile = result.files.single.bytes;

and instead of storageRef.putFile(uploadfile); , I used storageRef.putData(uploadfile);

I did encounter a MissingPluginException No implementation found for method StorageReference#putData at final fs.TaskSnapshot downloadUrl = await uploadTask;, which I resolved by updating the firebase_storage plugin to the latest.

Hope this helps anyone facing similar issue with Flutter Web in future.

Answered By – Ramanathan

Answer Checked By – Marie Seifert (FlutterFixes Admin)