Best way to upload multiple files from a browser

问题:

I'm working on a web application. There is one place where the user can upload files with the HTTP protocol. There is a choice between the classic HTML file upload control and a Java applet to upload the files.

The classic HTML file upload isn't great because you can only select one file at a time, and it's quite hard to get any progress indication during the actual upload (I finally got it using a timer refreshing a progress indicator with data fetched from the server via an AJAX call). The advantage: it's always working.

With the Java applet I can do more things: select multiple files at once (even a folder), compress the files, get a real progress bar, drag'n'drop files on the applet, etc...
BUT there are a few drawbacks:

• it's a nightmare to get it to work properly on Mac Safari and Mac Firefox (Thanks Liveconnect)
• the UI isn't exactly the native UI and some people notice that
• the applet isn't as responsive as it should (could be my fault, but everything looks ok to me)
• there are bugs in the Java UrlConnection class with HTTPS, so I use the Apache common HTTP client to do the actual HTTP upload. It's quite big a package and slows down the download of the .jar file
• the Apache common HTTP client has sometimes trouble going through proxies
• the Java runtime is quite big

I've been maintaining this Java applet for a while but now I'm fed up with all the drawbacks, and considering writing/buying a completely new component to upload theses files.

Question

If you had the following requirements:

• upload multiple files easily from a browser, through HTTP or HTTPS
• compress the files to reduce the upload time
• upload should work on any platform, with native UI
• must be able to upload huge files, up to 2gb at least
• you have carte blanche on the technology

What technology/compontent would you use?

---

Edit :

• Drag'n'Drop of files on the component would be a great plus.
• It looks like there are a lot of issues related to bugs with the Flash Player (swfupload known issues). Proper Mac support and upload through proxies with authentication are options I can not do without. This would probably rule out all Flash-based options :-( .
• I rule out all HTML/Javascript-only options because you can't select more than one file at a time with the classic HTML control. It's a pain to click n-times the "browse" button when you want to select multiple files in a folder.

回答1:

I implemented something very recently in Silverlight.

Basically uses HttpWebRequest to send a chunk of data to a GenericHandler.

On the first post, 4KB of data is sent. On the 2nd chunk, I send another 4K chunk.

When the 2nd chunk is received, I calculate the round trip it took between first and 2nd chunk and so now the 3rd chunk when sent will know to increase speed.

Using this method I can upload files of ANY size and I can resume.

Each post I send along this info:

[PARAMETERS] [FILEDATA]

Here, parameters contain the following: [Chunk #] [Filename] [Session ID]

After each chunk is received, I send a response back to my Silverlight saying how fast it took so that it can now send a larger chunk.

Hard to put my explaination without code but that's basically how I did it.

At some point I will put together a quick writeup on how I did this.

回答2:

I've never used it with files of 2GB in size, but the YUI File Uploader worked pretty well on a previous project. You may also be interested in this jQuery Plugin.

That said, I still think the Java Applet is the way to go. I think you'll end up with less portability and UI issues than you expect and Drag/Drop works great. For the record, Box.net uses a Java Applet for their multi-file quick uploads.

回答3:

OK this is my take on this

I did some testing with swfupload, and I have my previous experience with Java, and my conclusion is that whatever technology is used there is no perfect solution to do uploads on the browser : you'll always end up with bugs when uploading huge files, going through proxies, with ssl, etc...

BUT :

• a flash uploader (a la swfupload) is really lightweight, doesn't need authorization from the user and has a native interface which is REALLY cool, me thinks
• a java uploader needs authorization but you can do whatever you want with the files selected by the user (aka compression if needed), and drag and drop works well. Be prepared for some epic bugs debuggin' though.
• I didn't get a change to play with Silverlight as long as I'd like maybe that's the real answer, though the technology is still quite young so ... I'll edit this post if I get a chance to fiddle a bit with Silverlight

Thanks for all the answers !!

回答4:

There are a number of free flash components that exist with nice multiple file upload capability. They make use of ActionScripts FileReference class with a PHP (or whatever) receiver on the server side. Some have recently broken with the launch of FP10 but I know for certain that swfupload will work :)

Hope this helps!

回答5:

What about these two Jupload http://jupload.sourceforge.net/ and jumploader http://jumploader.com/

Both are java applets but they are also both really easy to use and implement.

回答6:

what about google gears?

回答7:

There are HTTP/HTTPS upload controls that allow multi-file upload. Here is one from Telerik, which I have found to be solid and reliable. The latest version looks to have most if not all of your feature requirements.

回答8:

You can upload multiple files with HTTP forms as well, as Dave already pointed out, but if you're set on using something beyond what HTTP and Javascript offers I would heavily consider Flash. There are even some pre-existing solutions for it such as MultiPowUpload and it offers many of the features you're looking for. It's also easier to obtain progress information using a Flash client than with AJAX calls from Javascript since you have a little more flexibility.

回答9:

You may check the Apache Commons FileUpload package. It allows you to upload multiple files, monitor the progress of the upload, and more. You can find more information here:

http://commons.apache.org/fileupload/
http://commons.apache.org/fileupload/using.html

Good luck

回答10:

Easiest way of file upload in java is GOJFileUpload.jar library

Here is the gojfileupload library tutorial:

GOJFileUpload

They give two method

• UploadFile(String filepath,ArrayList imagenames,HttpRequest request)
• UploadFile(String filepath,ArrayList dataname,ArrayList imagenames,HttpRequest request)

They'll return you HashMap the all file name which you uploaded after uploading at your given destination folder.