the blog

<script type="text/javascript" src="{{MEDIA_URL}}js/jquery.js"></script>
<script type="text/javascript" src="{{MEDIA_URL}}js/jquery.uploadProgress.js"></script>
<script type="text/javascript" charset="utf-8">
//<![CDATA[
$(document).ready(function() { 
    $(function() {
        $('#upload_form').uploadProgress({
            jqueryPath: "{{MEDIA_URL}}js/jquery.js",
            progressBar: '#progress_indicator',
            progressUrl: '{% url upload_progress %}',
            start: function() {
                $("#upload_form").hide();
                filename = $("#id_file").val().split(/[\/\\]/).pop();
                $("#progress_filename").html('Uploading ' + filename + "...");
                $("#progress_container").show();
            },
            uploadProgressPath: "{{MEDIA_URL}}js/jquery.uploadProgress.js",
            uploading: function(upload) {
                if (upload.percents == 100) {
                    window.clearTimeout(this.timer);
                    $("#progress_filename").html('Processing ' + filename + "...");
                } else {
                    $("#progress_filename").html('Uploading ' + filename + ': ' + upload.percents + '%');
                }
            },
            interval: 1000
        });
    });
});
//]]>
</script>

<div id="progress_container">
    <div id="progress_filename"></div>
    <div id="progress_bar">
        <div id="progress_indicator"></div>
    </div>
</div>

#progress_container {
    font-size: .9em;
    width: 100%;
    height: 1.25em;
    position: relative;
    margin: 3em 0;
    display: none;
}

#progress_filename {
    font-size: .9em;
    width: 100%;
}

#progress_bar {
    width: 100%;
    border: 1px solid #999;
}

#progress_indicator {
    background: #8a9;
    width: 0;
    height: 4px;
}

class UploadProgressCachedHandler(MemoryFileUploadHandler):
    """
    Tracks progress for file uploads.
    The http post request must contain a query parameter, 'X-Progress-ID',
    which should contain a unique string to identify the upload to be tracked.
    """

    def __init__(self, request=None):
        super(UploadProgressCachedHandler, self).__init__(request)
        self.progress_id = None
        self.cache_key = None

    def handle_raw_input(self, input_data, META, content_length, boundary, encoding=None):
        logger = logging.getLogger('uploaddemo.upload_handlers.UploadProgressCachedHandler.handle_raw_input')
        self.content_length = content_length
        if 'X-Progress-ID' in self.request.GET:
            self.progress_id = self.request.GET['X-Progress-ID']
        if self.progress_id:
            self.cache_key = "%s_%s" % (self.request.META['REMOTE_ADDR'], self.progress_id )
            cache.set(self.cache_key, {
                'state': 'uploading',
                'size': self.content_length,
                'received': 0
            })
            if settings.DEBUG:
                logger.debug('Initialized cache with %s' % cache.get(self.cache_key))
        else:
            logging.getLogger('UploadProgressCachedHandler').error("No progress ID.")

    def new_file(self, field_name, file_name, content_type, content_length, charset=None):
        pass

    def receive_data_chunk(self, raw_data, start):
        logger = logging.getLogger('uploaddemo.upload_handlers.UploadProgressCachedHandler.receive_data_chunk')
        if self.cache_key:
            data = cache.get(self.cache_key)
            if data:
                data['received'] += self.chunk_size
                cache.set(self.cache_key, data)
                if settings.DEBUG:
                    logger.debug('Updated cache with %s' % data)
        return raw_data

    def file_complete(self, file_size):
        pass

    def upload_complete(self):
        logger = logging.getLogger('uploaddemo.upload_handlers.UploadProgressCachedHandler.upload_complete')
        if settings.DEBUG:
            logger.debug('Upload complete for %s' % self.cache_key)
        if self.cache_key:
            cache.delete(self.cache_key)

def upload_progress(request):
    """
    Return JSON object with information about the progress of an upload.
    """
    progress_id = None
    if 'X-Progress-ID' in request.GET:
        progress_id = request.GET['X-Progress-ID']
    elif 'X-Progress-ID' in request.META:
        progress_id = request.META['X-Progress-ID']
    if progress_id:
        from django.utils import simplejson
        cache_key = "%s_%s" % (request.META['REMOTE_ADDR'], progress_id)
        data = cache.get(cache_key)
        json = simplejson.dumps(data)
        return HttpResponse(json)
    else:
        return HttpResponseBadRequest('Server Error: You must provide X-Progress-ID header or query param.')

upload_progress uploaddemo 1m;

server {
    listen 80;
    server_name example.com;

    client_max_body_size 1000m;

    location ^~ /upload/progress {
        report_uploads uploaddemo;
    }

    location /media/ {
        alias /usr/local/django/test/uploaddemo/media/;
    }

    location / {
        fastcgi_pass                127.0.0.1:8080;
        fastcgi_pass_header         Authorization;          
        fastcgi_hide_header         X-Accel-Redirect;
        fastcgi_hide_header         X-Sendfile;
        fastcgi_intercept_errors    off;
        fastcgi_param               CONTENT_LENGTH          $content_length;
        fastcgi_param               CONTENT_TYPE            $content_type;
        fastcgi_param               PATH_INFO               $fastcgi_script_name;
        fastcgi_param               QUERY_STRING            $query_string;
        fastcgi_param               REMOTE_ADDR             $remote_addr;
        fastcgi_param               REQUEST_METHOD          $request_method;
        fastcgi_param               REQUEST_URI             $request_uri;
        fastcgi_param               SERVER_NAME             $server_name;
        fastcgi_param               SERVER_PORT             $server_port;
        fastcgi_param               SERVER_PROTOCOL         $server_protocol;
        track_uploads uploaddemo 30s;
    }
}