All users were logged out of Bugzilla on October 13th, 2018

Allow folder dropped into the browser to be read (and uploaded)

RESOLVED DUPLICATE of bug 1164310

Status

()

--
major
RESOLVED DUPLICATE of bug 1164310
6 years ago
2 years ago

People

(Reporter: me, Unassigned)

Tracking

Trunk
Points:
---
Dependency tree / graph

Firefox Tracking Flags

(Not tracked)

Details

Attachments

(1 attachment)

(Reporter)

Description

6 years ago
Created attachment 754520 [details]
test case

I'd like to implement (recursive) uploading of folders in my application and for this to work, the current event.dataTransfer.files object doesn't offer enough flexibilty (it can't handle folders).

Now, Webkit exposes the event.dataTransfer.item.webkitGetAsEntry() method, which can be parsed normally with a FileReader to get File objects. Mozilla's equivalent, event.dataTransfer.mozGetDataAt() throws this permission error when trying to access the binary data using the type "application/x-moz-file":

Error: Permission denied for <domain> to create wrapper for object of class UnnamedClass

I'm not sure if this permission error is intented as the docs at MDN (https://developer.mozilla.org/en-US/docs/DragDrop/Recommended_Drag_Types#Dragging_Files) state that non-privileged web pages are not able to retrieve binary data. The file drop is parsed in a script off the same origin, shouldn't it be trusted?

See attached test case for an example.
(Reporter)

Updated

6 years ago
Attachment #754520 - Attachment mime type: text/plain → text/html
(Reporter)

Comment 1

6 years ago
Here's some info on the getAsEntry API which Chrome provides (I couldn't find a relevant bug, so I'm adding this here):

http://wiki.whatwg.org/wiki/DragAndDropEntries
(Reporter)

Updated

5 years ago
Component: Drag and Drop → DOM: Events
Summary: Permission Error when trying to get a nsIFile from a dropped File → Allow folder dropped into the browser to be read (and uploaded)

Comment 2

5 years ago
Following up a little: getAsEntry is used on each item of the items array and returns DirectoryEntry or FileEntry which is then used via createReader() or file() to further process the data.

At present, this seems only to be available via drag and drop. It does not work in Chrome via input type=file. There's a minor issue about accessibility here as it can be difficult in some situations to drag and drop files into the browser and there seems to be no alternative means of performing this operation that has general consensus among the security minded crowd.
Duplicate of this bug: 782233
Depends on: 846931

Comment 4

5 years ago
Mozilla offers a method `mozGetDataAt` (along with other methods and properties) on the `dataTransfer` object of the `originalEvent` property of a `drop` event (source: [Mozilla Docs] [1]). But `mozGetDataAt` cannot be run on an "non-privileged" page (source: [Mozilla Docs] [2]). A solution existed in 2010 to give Javascript the "privilege" to do so (source: [Stack Overflow] [3]), but that feature has since been removed from Firefox (source: [Mozilla Support] [4]). Permission to run the method `mozGetData` appears to be reserved only for extensions (source: [Mozilla Docs] [5]).

Footnotes

[1]: https://developer.mozilla.org/en-US/docs/DragDrop/Dragging_and_Dropping_Multiple_Items#Multiple_Drop_Example "Mozilla - Dragging and Dropping Multiple Items"
[2]: https://developer.mozilla.org/en-US/docs/DragDrop/Recommended_Drag_Types#Dragging_Files "Mozilla - Recommended Drag Types"
[3]: http://stackoverflow.com/questions/1067947/can-i-drag-files-from-the-desktop-to-a-drop-area-in-firefox-3-5-and-initiate-an "StackOverflow - Can I drag files from the desktop to a drop area in Firefox 3.5 and initiate an upload?"
[4]: https://support.mozilla.org/en-US/questions/936845 "Mozilla Support - netscape.security.PrivilegeManager.enablePrivilege("UniversalXPConnect") does not works anymore afer ff15.0.1 update ?"
[5]: https://developer.mozilla.org/en-US/docs/Code_snippets/Interaction_between_privileged_and_non-privileged_pages "Mozilla - Interaction between privileged and non-privileged pages"
(Reporter)

Comment 5

5 years ago
The difference between mozGetDataAt and the proposed getAsEntry API is that the former provides a nsIFile while the latter exposes File objects, which Firefox handles pretty well already through the File API.

Comment 6

4 years ago
Any updates here?

It would be really cool to have event.dataTransfer.items + item.getAsEntry implemented. I also want to use directory reading.

If we implement these methods -- we don't need to consider privileges since user selected files himself.

By the way -- what is the standard for these methods -- File API? It is deprecated and we should ask HTML5 guys to include directories into current standard.
http://code.flickr.net/2012/12/10/drag-n-drop/
Blocks: 846931
Depends on: 906420
No longer depends on: 846931
Duplicate of this bug: 1093989
Duplicate of this bug: 79465
A pseudo-solution is described here:
http://stackoverflow.com/questions/11620939/is-there-a-mozilla-equivalent-to-webkitgetasentry
but it's not something I'd recommend sites use, and I can't even get it to work in the first place (testing in the console from a breakpoint in an event handler)
BTW, code using a webkit-prefixed method is actively evangelised:
http://updates.html5rocks.com/2012/07/Drag-and-drop-a-folder-onto-Chrome-now-available
Getting deployed code fixed is going to be a compat head ache
Shouldn't this bug be marked as NEW instead of UNCONFIRMED if we make it block other bugs?

Updated

4 years ago
Status: UNCONFIRMED → NEW
Ever confirmed: true
Per comment in bug 1093989, might be fixed in this spec: http://w3c.github.io/filesystem-api/Overview.html

Comment 14

4 years ago
 It would be nice to avoid having Flash/Java required for a few more years. Has anyone discussed something like a simple opt-in extension where an accessor like e.g. `evt.dataTransfer.recursiveFiles` would return a FileList with nested files and each File instance would include the qualified path in .name? That would solve a pretty common need without waiting for the complexity & security considerations of the full FileSystem API to be resolved.

Comment 15

4 years ago
I'd like to see a working implementation, too. But while
https://wiki.whatwg.org/wiki/DragAndDropEntries
still describes the approach used by Chrome, 
http://www.w3.org/TR/file-system-api/
says: "Work on this document has been discontinued and it should not be referenced or used as a basis for implementation."

That's a pity in my eyes, because that spec really works and provides most things that I need. Does anyone know about an alternative spec being in active development?

Comment 16

4 years ago
(In reply to Oliver Frietsch from comment #15)
> That's a pity in my eyes, because that spec really works and provides most
> things that I need. Does anyone know about an alternative spec being in
> active development?

The IE team recently updated https://wpdev.uservoice.com/forums/257854-microsoft-edge-developer/suggestions/6261304-drag-and-drop-directories with an early proposal:

http://microsoftedge.github.io/directory-upload/proposal.html

That looks like it'd cover the most common needs pretty well.
(Reporter)

Comment 17

4 years ago
See Bug #1164310 for the implementation of that proposal.
(Reporter)

Comment 18

3 years ago
Bug 1164310 has some recent work on MS's new proposal. Resolving this bug in favor of it.
Status: NEW → RESOLVED
Last Resolved: 3 years ago
Resolution: --- → DUPLICATE
Duplicate of bug: 1164310
This has been marked as "Resolved Duplicate" but it has not been resolved. 

It is not possible to upload folders in Firefox yet.
(Reporter)

Comment 20

2 years ago
It will be available in version 50 in a little more than 2 weeks, see https://developer.mozilla.org/en-US/Firefox/Releases/50#Files_and_directories.
Congratulations to everyone who worked on this - Firefox version 50 now supports folder upload!

A very useful feature for anyone uploading content through the browser. I tested uploading a folder of images to https://my.sirv.com/ both with drag-and-drop and folder selection and both methods worked perfectly.

Great job!
You need to log in before you can comment on or make changes to this bug.