Upload Progress Bars in IE9 (and older) with Simple Ajax Uploader

Overview

The HTML5 progress event is not supported by Internet Explorer 9 (or older). However, progress tracking can still be achieved in these browsers by sending intervaled requests to the server for upload progress updates. Simple Ajax Uploader has built-in support for handling this process.

How it Works

When the plugin detects support for the HTML5 File API, the native progress event is used to track upload progress.

For older browsers (i.e., IE9 and below), the plugin can be enabled to automatically retrieve progress updates from the server over the course of the upload to ensure a consistent, pleasant experience for all users.

As of version 1.11, Simple Ajax Uploader provides three different options for handling server-side progress updates:

• PHP APC File Upload Progress (PHP 5.3 and older only)
• PHP Session Upload Progress (PHP 5.4+)
• Nginx Upload Progress Module

PHP Session Upload Progress

PHP Session Upload Progress is the easiest to use, as it comes enabled by default (but only in PHP 5.4+).

In most cases, the only configuration needed will be to upload sessionProgress.php (extras folder) to your web directory, and then set the sessionProgressUrl Javascript option to point to its location.

PHP defaults are used by the plugin for all progress settings, so unless you have disabled or changed any of the session.upload_progress runtime options, no further adjustments should be necessary.

Note: This method will not work for cross-domain (CORS) requests.

PHP APC File Upload Progress

This method requires PHP with the APC extension installed and the apc.rfc1867 option enabled. (to check if APC is installed, use phpinfo() to view all installed PHP extensions).

Note: If APC is already installed, you may still need to add apc.rfc1867=1 to apc.ini, as it is not enabled by default.

To APC install:

sudo pecl install apc

Accept the default settings, and then create a configuration file:

sudo vi /etc/php.d/apc.ini

Add these two lines, and then save:

extension=apc.so
apc.rfc1867=1

Restart your server for the changes to take effect.

Finally, save uploadProgress.php (included in the extras folder) to your web directory, and set the progressUrl option in your Javascript settings to the URL of its location.

Nginx Upload Progress Module

Upload Progress Module is not distributed with the Nginx source, so you will probably need to install it. The module's documentation includes installation info, as well as a sample configuration.

Note: Unlike Apache, Nginx modules cannot be added on. Instead, you must recompile Nginx with the new module.

Once the Upload Progress Module is installed and configured, add the module's upload_progress_json_output directive to your Nginx configuration.

Finally, set the nginxProgressUrl option in your Javascript settings to the location in which the report_uploads was added in your Nginx configuration.