javascript - 有没有办法确定 blob URL 是否指向某些内容？

Question

目前正在开发一个项目，我们通过 AJAX 获取大量图像。 我们做了很多这样的事情，看起来 IE11 似乎失去了很多。

我们获取图像，调用“URL.createObjectURL”，获取有效的 URL，但到了下一行，图像就消失了。这在其他浏览器中工作得很好，我假设我们在 IE 中遇到了一些限制。

是否有比尝试加载该 URL 更好的方法来检测该 URL 是否有效？

似乎有点多余:

• AJAX 文件。
• 获取其在用户电脑上的地址。
• AJAX 该地址以确保其存在。

代码:

var urlObj = window.URL || window.webkitURL;
var xhr = new XMLHttpRequest();
xhr.onreadystatechange = function() {
    if (this.readyState == 4) {
        active--;
        if (this.status == 200) {
            var blobUrl = urlObj.createObjectURL(new Blob([this.response], {type : 'image/jpeg'}));
            image.setSource(blobUrl); 
        }
    }
}
xhr.open('GET', url);
xhr.responseType = 'arraybuffer';
xhr.send();

因此，如果您多次调用此方法(使用不同的 URL) - 我们传递给 setSource 的 blobUrl 是一个看起来合理的对象 URL，但是当您尝试使用它时，您会收到错误。 IE要么清理了内存，要么丢失了图像什么的。请记住，我们不会更改页面、丢失 session 或撤销 blobUrl。

我能想到的检查是否发生这种情况的唯一方法(即 blobURL 不再指向任何内容)，是在 blobURL 上触发另一个 AJAX 请求，并检查它返回 200 等...... 有没有更好的办法？我想不会。

我已经从一个更大的 block 中“雕刻”了这个代码块，所以如果有任何明显的错误，那就是原因。大约 95% 的时间它都有效。如果我随后触发 AJAX“检查”，并在失败时再次加载图像，则可以修复问题。

奇怪的 IE 行为。还有人看过这个吗？

更多信息:我们没有使用 pdf.js，但这里报告了同样的问题:https://connect.microsoft.com/IE/feedback/details/813485/resource-blob-not-found-when-using-url-createobjecturl-blob

Answer 1

这(或多或少)是我们正在使用的检查:

var xhr = new XMLHttpRequest();
xhr.onreadystatechange = function(){
    if (this.readyState == 4){
        if (this.status == 200 || (this.response && this.response.type && this.response.type == "image/jpeg")) {
            success(blobUrl);
        }
        else {
            fail(blobUrl);
        }
    }
}
xhr.open('GET', blobUrl);
xhr.responseType = 'blob';
xhr.send();

必须使用奇怪的response.type检查，因为Firefox返回的状态== 0。