为什么ProgressEvent.lengthComputable为false？ [英] Why is ProgressEvent.lengthComputable false?

问题描述

我在Google Chrome，Safari和Firefox中使用XMLHttpRequest加载JSON文件。在所有三个浏览器中，我收到 ProgressEvent ，它们正确显示 .loaded 属性。但是 .lengthComputable 属性为false， .total 属性为零。我已经检查过 Content-Length HTTP标头正在发送并且是正确的 - 它是。响应是gzip编码的，但 Content-length 正确显示编码长度（在解压缩之前）。

I am loading a JSON file using XMLHttpRequest in Google Chrome, Safari and Firefox. In all three browsers I am receiving ProgressEvents which correctly show the .loaded property. However the .lengthComputable property is false and the .total property is zero. I have checked that the Content-Length HTTP header is being sent and is correct - it is. The response is being gzip-encoded, but the Content-length correctly shows the encoded length (before decompression).

为什么我的 ProgressEvent 中的总长度不可用？

Why would the total length not be available in my ProgressEvents?

以下是标题：

HTTP/1.1 200 OK
ETag: "hKXdZA"
Date: Wed, 20 Jun 2012 20:17:17 GMT
Expires: Wed, 20 Jun 2012 20:17:17 GMT
Cache-Control: private, max-age=3600
X-AppEngine-Estimated-CPM-US-Dollars: $0.000108
X-AppEngine-Resource-Usage: ms=2 cpu_ms=0 api_cpu_ms=0
Content-Type: application/json
Content-Encoding: gzip
Server: Google Frontend
Content-Length: 621606

注意：该文件通过Google App Engine提供。

Note: the file is being served via Google App Engine.

这是JavaScript：

Here is the JavaScript:

var req;
if (window.XMLHttpRequest){
    req = new XMLHttpRequest();
    if(req.overrideMimeType){
        req.overrideMimeType( "text/json" );
    }
}else{
    req = new ActiveXObject('Microsoft.XMLHTTP');
}

// Listen for progress events
req.addEventListener("progress", function (event) {
    console.log(event, event.lengthComputable, event.total);
    if (event.lengthComputable) {
        self.progress = event.loaded / event.total;
    } else if (this.explicitTotal) {
        self.progress = Math.min(1, event.loaded / self.explicitTotal);
    } else {
        self.progress = 0;
    }
    self.dispatchEvent(Breel.Asset.ON_PROGRESS);
}, false);

req.open('GET', this.url);

注意： console.log 代码显示数百个事件，最新 .loaded s但 .lengthComputable 始终为false且 .total 始终为零。 self 指的是负责此 XMLHttpRequest 的对象。

Note: The console.log in that code is showing hundreds of events with up to date .loadeds but .lengthComputable is always false and .total is always zero. self refers to the object responsible for this XMLHttpRequest.

推荐答案

如果XMLHttpRequestProgressEvent中的lengthComputable为false，则表示服务器从未在响应中发送Content-Length标头。

If lengthComputable is false within the XMLHttpRequestProgressEvent, that means the server never sent a Content-Length header in the response.

如果你使用nginx作为代理服务器，这可能是罪魁祸首，特别是如果它没有将Content-Length头从上游服务器通过代理服务器传递到浏览器。

If you're using nginx as a proxy server, this might be the culprit, especially if it's not passing the Content-Length header from the upstream server through the proxy server to the browser.

这篇关于为什么ProgressEvent.lengthComputable为false？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！