Question 77234 in Flutter Question posted in
The official Flutter documentation can be found here.

How do I select a directory on Flutter web?

We are trying to make it possible for users to select entire folders to upload them to our back end. This is no problem on Android and iOS, where I can use getDirectoryPath() from FilePicker, and then get all the files using Directory(path).listSync(recursive: true).

The issue is that this isn’t available on web, and while i can exchange dart:io for universal_io, that doesn’t help with getDirectoryPath().

Is there any other approach that I can use here? The end goal is to upload the selected folder to Google Cloud Storage, so one Idea that I have is to bypass Flutter entirely, but I haven’t figured out a way to do that yet. Any ideas?

Tags:

2

Answers


  1. 0

    There is File System Access API and showDirectoryPicker, which would be the way to go, but it is not supported by all browsers.

    One option would be to allow a user to pick multiple files and upload bytes. Not the same thing, but in some cases would be sufficient. Something like this:

    final result = await FilePicker.platform.pickFiles(allowMultiple: false);

if (result != null && result.files.isNotEmpty) {
  final fileBytes = result.files.first.bytes;
  final fileName = result.files.first.name;
  
  // TODO upload file
}
    Login or Signup to reply.
  2. 0

    Use a JavaScript library: You can use a JavaScript library such as file-uploader or dropzone.js to handle file uploads in your web application. These libraries provide a file explorer interface for the user to select and upload files, and can be integrated with Flutter using dart:js and package:js

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search