27

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

Andreas Grech
  • 105,982
  • 98
  • 297
  • 360
Isaac Waller
  • 32,709
  • 29
  • 96
  • 107
  • That *isn't* the best way to show picture download progress, so it would help to know what you **actually** want to do.... – Craig Stuntz Dec 30 '08 at 13:54
  • 1
    This [stackoverflow thread][1] discusses the same problem. [1]: http://stackoverflow.com/questions/76976/how-to-get-progress-from-xmlhttprequest – Markus Peröbner Jul 29 '10 at 08:04

2 Answers2

13

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.

Soviut
  • 88,194
  • 49
  • 192
  • 260
2

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 ...

Community
  • 1
  • 1
Nealv
  • 6,856
  • 8
  • 58
  • 89