AJAX Page Download progress

Question

I want to get the progress of my AJAX request - how much has been downloaded so far out of how much the file is. For example, I am downloading a large picture with AJAX so I can put the content in a DATA url (this may not be the best way to do that, it's just a example.)

So, I make the AJAX request to some host I have no control over (flickr), and report the progress back to the user. I cannot find a way to do this without a server-side script or something like that. Preferably the solution would use JQuery, because that is what I use for my website. Thanks! Isaac

Answer 1

As far as I know, the $.ajax() function has no support for "bytes loaded". It only has start and complete events, no progress event.

I found this thread detailing an attempt, but apparently the code works in several browsers but not IE. The suggestion they make is to show progress in other browsers, and a simple "loading..." message for IE.

Do note that there are several similar discussions on the same site, so browse the left panel for other methods.

Answer 2

This page also offers a solution for your problem, but unfortunately it also doesn't run with IE.

Answer 3

This stackoverflow thread discusses the same problem.

Answer 4

Some browser provide support for download status events wher you can track your progress (i know ff 3.5+ does).

This is done by ajax XHR.

You can read more here and here

also, it is possible to split up a file in an array (let's say we divide it in 10 pieces),

now send 1peace, and return succes after, progress = 10% etc ...