2015-01-04 11 views
7

Sto tentando di mostrare una barra di avanzamento prima di navigare da una pagina all'altra all'interno dello stesso sito web.XMLHttpRequest suprogress total è sempre 0 su Chrome

La mia funzione si lega una funzione UpdateProgress per XMLHttpRequest evento onProgress e reindirizza utente ad una nuova pagina sul (xhr.readyState == 4 & & xhr.status == 200) Sembra che lavora bene, tranne che Chrome mostra "totale "come zero che non consente alla barra di avanzamento di funzionare correttamente. Il mio codice è sotto

Grazie in anticipo ...

$('.ajaxNavi').click(function (e) { 
    e.preventDefault(); 
    var url = $(this).attr('href'); 
    var xhr = new XMLHttpRequest(); 
    xhr.onprogress = updateProgress; 
    xhr.onreadystatechange = function() { 
    if (xhr.readyState == 4 && xhr.status == 200) 
    // REDIRECT HERE 
    } 
    }); 
    xhr.open("GET", url, true); 
    xhr.setRequestHeader("Content-Type", "text/html"); 
    xhr.send(); 
}); 

function updateProgress(e) { 
    console.log(e.loaded + ' ' + e.total); 
} 
+0

Un problema specifico di Chrome? –

+0

Penso di sì ... perché mozilla mostra correttamente il valore e.total. – B10

+0

Appena verificato, IE visualizza anche il valore ... – B10

risposta

2

due anni di ritardo, ma a questa domanda sembra avere un sacco di punti di vista e dovrebbe probabilmente essere risolta.

In base alla domanda this, una risposta gzippata avrà sempre lunghezzaComputable impostata su false in Chrome. Questo ha molto senso perché potresti sapere quanti più dati compressi stanno arrivando lungo la pipe, ma non puoi avere idea di quanto espandono i dati compressi.

Questo solution mi sembra buono.

Problemi correlati