¿Hay alguna manera de obtener el progreso de carga jQuery ajax?

$.ajax({ xhr: function() { var xhr = new window.XMLHttpRequest(); //Upload progress xhr.upload.addEventListener("progress", function(evt){ if (evt.lengthComputable) { var percentComplete = evt.loaded / evt.total; //Do something with upload progress console.log(percentComplete); } }, false); //Download progress xhr.addEventListener("progress", function(evt){ if (evt.lengthComputable) { var percentComplete = evt.loaded / evt.total; //Do something with download progress console.log(percentComplete); } }, false); return xhr; }, type: 'POST', url: "/", data: {}, success: function(data){ //Do something success-ish } }); 

Esto no funciona en jQuery 1.5+ porque el xhr es reemplazado por el jqXHR (es decir, una versión de alto nivel del XHR en bruto). Ahora la pregunta es cómo hacer que funcione con jqXHR … ¿Alguien sabe cómo hacerlo?

Prueba esto

 $.ajax({ url: path, xhr: function () { var xhr = $.ajaxSettings.xhr(); xhr.upload.onprogress = function (e) { if (e.lengthComputable) { console.log(e.loaded / e.total); } }; return xhr; } }).done(function (e) { }) 

Hice un plugin jquery para manejar los eventos de carga o descarga de forma fácil. Funciona con cualquier método ajax jquery como $ .ajax, $ .get, $ getJSON, $ .post, etc. Puede descargarlo desde aquí: https://github.com/cvelazquez/jquery.ajax.progress

 var jqXHR = $.post('www.somedomain.com', {data:"real long data, o maybe a file upload"}, function(response){ /* do anything on finish */ }); $(jqXHR).on('uploading', function(proxyEvent, event){ if (event.lengthComputable) { // You can do anything here console.log("Uploaded " + parseInt( (event.loaded / event.total * 100), 10) + "%"); } }); 

Al buscar en la documentación y otras preguntas, parece haber un complemento para monitorear el progreso de jquery ajax: https://github.com/hiddentao/jquery.ajaxprogress