WFileUpload with progress bar

by koen on Monday, October 25, 2010 @ 12:14

The latest Wt git includes two nice improvements to the WFileUpload widget:

  • you can enable the upload of multiple files at once, if supported by the browser (recent browsers support this).

  • the widget includes signals that can be used to track upload progress, which can be diplayed using for example a progress bar (yes, WProgressBar is also a new class).

  • the back-end logic has been reworked to use a HTTP 413 status code (request entity too large) to refuse large files immediately after reading the request header.

You can see the new features at work in the updated composer example.

The progress bar works cross-browser (any Ajax browser will do, including old rusty IE6!), unlike other solutions which either require a Flash plugin, a Java applet, or a very recent browser.

To use these new features, see the following example which is an excerpt from the AttachmentEdit in the composer example:

/*
 * Instantiate the file upload.
 */
upload_ = new WFileUpload(this);
upload_->setMultiple(true);
upload_->setFileTextSize(40);

/*
 * Configure a progress bar.
 */
WProgressBar *progress = new WProgressBar();
progress->setFormat(WString::Empty);
progress->setVerticalAlignment(AlignMiddle);
upload_->setProgressBar(progress);

There is currently one big limitation: the current implementation requires that you use the wthttp connector (Wt’s builtin-web server) for deployment. Support for the isapi connector (for Microsoft IIS) will be added easily, but the wtfcgi connector (for FastCGI) will not work. We currently rely on monitoring the incoming request, but FastCGI modules buffer the incoming request in the web server as a service to free up processes/threads used by FastCGI applications while receiving the large POST (oh irony that Wt uses async I/O which is more scalable than the old synchronous implementation of apache, lighttpd, and the likes!).

In the future we will also support the new JavaScript File API (as being implemented in Firefox 4). which allows to monitor upload progress client-side, and which thus will work regardless of connector used.

4 comments
anandogc 3 years ago
Is there a way to upload very big files ?
anandogc 3 years ago
Some one gave me the solution in the Wt chat room.
It is: increate max-request-size in wt-config.xml
zhmsong 3 years ago
Great!
We can do a big tmp file exchange lib:-)
dmitigr 3 years ago
Really, good job!
I am happy to see how Wt grows from commit to commit! :-)