XMLHttpRequest onprogress total jest zawsze 0 w Chrome

Question

Próbuję pokazać pasek postępu przed przejściem z jednej strony na drugą w tej samej witrynie.

Moja funkcja wiąże funkcję updateProgress do XMLHttpRequest onProgress imprezy i przekierowuje użytkownika do nowej strony na (xhr.readyState == 4 & & xhr.status == 200) Wydaje się, że działa poprawnie z wyjątkiem Chrome pokazuje „całkowitej "jako zero, które nie pozwala na prawidłowe działanie paska postępu. Mój kod znajduje się poniżej.

Z góry dziękuję ...

$('.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); 
} 

Answer 1

Dwa lata późno, ale to pytanie wydaje się mieć wiele poglądów i należy prawdopodobnie odpowiedział.

Zgodnie z this pytanie gzipped response zawsze będzie miało lengthComputable ustawiony na false w Chrome. Ma to wiele sensu, ponieważ możesz wiedzieć, o ile bardziej skompresowane dane trafiają w dół, ale nie możesz mieć pojęcia, do jakiego stopnia skompresowane dane zostaną rozszerzone.

Ten solution wydaje mi się dobry.