XmlHttpRequest onprogress interval

Question

I'm using XmlHttpRequests to upload images to a server and I'd like to show the user the progress of these uploads.

Unfortunately the interval between calls to my onprogress-event handler is too large. Usually onprogress is called only once or twice for a 500k image.

Here is my code:

/* This function is not called often enough */ function progress(e){     console.log('Uploading: ' + Math.round((e.loaded / e.total) * 100) + ' %'); }  var xhr = new XMLHttpRequest(); xhr.upload.addEventListener('progress', progress, false); xhr.send(data); 

Can this behaviour be changed or is this hardcoded somewhere in the browser implementation?

Answer 1

The W3 sets forth the following guidelines in their XMLHttpRequest Level 2 document. Obviously varying levels of conformance across browsers are to be expected.

Uploads:

While the request entity body is being uploaded and the upload complete flag is false, queue a task to fire a progress event named progress at the XMLHttpRequestUpload object about every 50ms or for every byte transmitted, whichever is least frequent. - W3 XMLHttpRequest Level 2 (Bolded for emphasis)

Downloads:

When it is said to make progress notifications, while the download is progressing, queue a task to fire a progress event named progress about every 50ms or for every byte received, whichever is least frequent. - W3 XMLHttpRequest Level 2 (Bolded for emphasis)

I am not aware of an api to customize this functionality.

Answer 2

Also, be careful that local debugging HTTP proxies (like Charles, for instance) tend to affect progress events firing interval.