javascript - 不能使用通过调用 getResponseHeader 获得的值

Question

我在使用我在 Greasemonkey 脚本上调用 getResponseHeader 时获得的值时遇到问题。

首先，我声明了以下全局变量:

size = 0;
maxS = 153600; // Max. size (bytes).

网站完全加载后，将调用我的主要功能，并在其中获取特定 div 中的所有图像(此处未显示，因为它不相关):

function main() {
    ...
    var imgs = posts[i].getElementsByTagName('img');
    for (var j = 0; j < imgs.length; ++j) {
        getFileSize(imgs[j].src, responseHandler);
        if (size > maxS)
            // Do something
    }
    ...
}

这就是 getFileSize 的工作原理:

var getFileSize = function(address, responseHandler) {
    var req = new XMLHttpRequest();
    req.open('head', address, true);
    req.onreadystatechange = responseHandler;
    req.send(null);
};

var responseHandler = function(resp) {
    if (this.readyState == 1)
    this.abort();
    size = this.getResponseHeader("Content-length");
};

问题是，即使我在句子后面检查 size 的值

size = this.getResponseHeader("Content-length");

这个值是我所期望的，在main函数中，当它到达这部分代码时它的值仍然是0:

if (size > maxS)
    // Do something

我试图通过检查我在该网站上发现的其他一些问题来找出答案，我猜测它与同步有关，但我真的不知道如何解决这个问题.

Answer 1

图像都在完全相同的服务器上，对吗？ XMLHttpRequest() 不会执行跨域请求(没有一些不适用于 Greasemonkey 上下文的新环)。

该代码存在一些问题:

1. 它期望同步设置大小，但异步调用 XMLHttpRequest()。
2. 它中止请求!而且太快了。没有充分的理由中止 HEAD 请求。
3. 它以一种模糊的方式使用了一个“魔数(Magic Number)”。如果可用，请使用适当的枚举常量。 EG this.readyState == 1 不好。 this.readyState == this.OPENED 更好。

---

对于同步操作，更改getFileSize()。像这样调用它:

getFileSize (imgs[j].src);

这样定义:

function getFileSize (address) {
    var request = new XMLHttpRequest();  
    request.open ('HEAD', address, false);  //-- false = Synchronous
    request.send (null);  

    size        = -666; // Error, or AJAX fail.
    if (request.status === 200) {  
        size    = request.getResponseHeader ("Content-length");
    }  
}

---

注意事项:

1. 出于性能和用户友好性的原因，最好重构使用异步 AJAX 的方法。但这是另一个问题，不太直观。
2. 如果图像是跨域的，您将需要使用 GM_xmlhttpRequest() - 它的运行方式略有不同并且不能正常用于同步 AJAX(我最后检查过 - 这是一对几个月前)。