[Feature Request] dcc.Upload let's user upload a folder and all of its contents

[shanepalmer1]

Currently dcc.Upload requires users to select all the files they want to upload when multiple=True.

My project requires the users to upload all the contents of a folder of their choice. I'd rather not leave it up to the user to select all files from the folder they are interested in. It would be much more efficient for the dcc.Upload component to allow users to select a folder and automatically upload all the contents within the folder.

[alexcjohnson]

A reasonable request, but I don't think browsers allow that, for security purposes. From https://developer.mozilla.org/en-US/docs/Web/API/FileReader:

FileReader can only access the contents of files that the user has explicitly selected, either using an HTML <input type="file"> element or by drag and drop.

ie they want users to be very explicit about every file they're uploading.

[shanepalmer1]

@alexcjohnson Thanks for the response. I can definitely see how this would be a security concern after looking at the link you sent. For our project the application wouldn't be hosted on the web. I came across this post on stack overflow yesterday where it looks like it is possible using HTML form and input tags. Unfortunately, I couldn't get this solution to mesh with Dash components.

Nevertheless, I'll settle for prompting the user with instructions and catching any missing files. Thanks again.

T

[alexcjohnson]

Oh interesting - I had never seen webkitdirectory, though it's been around for years in essentially all browsers - I guess they decided the risk is acceptable? That said, it's not supported by the react-dropzone project we use for dcc.Upload, and MDN cautions:

Though originally implemented only for WebKit-based browsers, webkitdirectory is also usable in Microsoft Edge as well as Firefox 50 and later. However, even though it has relatively broad support, it is still not standard and should not be used unless you have no alternative.

Anyway if anyone is motivated to try and add this support into react-dropzone we'd be glad to extend that support into Dash.

[thakkarparth007]

@alexcjohnson react-dropzone now seems to support folders