file upload via drag and drop

问题:

Ok here is my problem.
I need to be able to have a user drag multiple images from the locate file system onto the flash/flex/html5 app which will then taker the file name details and contact the server.
Upon server response then upload the file ( assuming server validation passed ).

I know this can be done in Java but that is not an option.

Please do not suggest the FileReference.browse function as the retouchers are to stupid(no joke here) to use this and it has to be drag and drop.
This has to work with all current versions of the popular browsers( Chrome,FireFox,IE,Safari)

What it comes down to is I want to put an image up on the web page stating drop here and allow them to upload the file(s) by dropping on it.
Also this has to be a web interface I do not want to install a plugin or a downloaded Air app.(they are to stupid for all this)

Is this possible with flash/flex/html5? or any combination of them

回答1:

Not possible with a web app in flash/flex - but you can do it inside air. It's basically a security issue.

As far as HTML5 - Only Firefox and Chrome currently support HTML5 native drag and drop events that I'm aware (Chrome would include some other webkit variants like safari)

回答2:

Try this http://www.plupload.com/ It include all kinds of uploaded flash,silver light, gear, html 5 and html4.

As other people mention that drag and drop will not work for all browser. Limitation listed below.

1. Drag/drop support of files is currently only available in Firefox 3.5+. WebKit/Opera doesn't support this feature yet.
2. Image resizing is only possible on Firefox 3.5+ and only at a fixed quality. WebKit/Opera doesn't support direct data access to the selected files.
3. File type filtering is currently not supported by any browser. But we fill the HTML 5 accept attribute so once the support is there it will work.
4. Multipart upload is only supported in Gecko based browsers. WebKit doesn't support direct access to file data.

If you are interseted in Applet try this.. http://jumploader.com/ Both control allow you to resize on client ( I know you haven't requested that)

回答3:

For HTML5, see this great tutorial (browser coverage included): http://www.thebuzzmedia.com/html5-drag-and-drop-and-file-api-tutorial