文件API无法在Google Chrome扩展程序中与Blob一起使用

Question

我正在编写Google Chrome浏览器扩展程序，需要在其中下载页面图像并将其保存在磁盘上的临时文件中。 为此，我创建一个XMLHttpRequest并使用它来下载图像。 在回调函数中，当图像包含在request.response中时，我使用window.webkitRequestFileSystem(window.TEMPORARY, 1024 * 1024 * 20, writeImageToFile, errorHandler)从Windows请求一个临时文件。 在回调函数writeImageToFile中，我创建FileWriter对象并将blob写入其中。 该文件正在创建中，但是我无法找到它的创建位置。 我需要扩展名文件的Windows路径。 请帮忙！

Answer 1

为了您的目的，您不需要虚拟文件系统。 使用webkitURL.createObjectURL方法从Blob创建URL：

window.webkitURL.createObjectURL(blob);

从Chrome 19开始，您可以使用responseType直接获取Blob对象：

var xhr = new XMLHttpRequest();
xhr.responseType = 'blob';
xhr.onload = function() {
    // xhr.response is a Blob
    var url = webkitURL.createObjectURL(xhr.response);
    console.log('URL: ', url);
};
xhr.open('GET', 'http://example.com/favicon.ico');
xhr.send();

从Chrome 10开始，您可以获得ArrayBuffer响应，并将其转换为blob（ demo ）：

var xhr = new XMLHttpRequest();
xhr.responseType = 'arraybuffer';
xhr.onload = function() {
    // Create blob from arraybuffer
    var bb = new (window.BlobBuilder || window.WebKitBlobBuilder)();
    bb.append(xhr.response);
    var url = webkitURL.createObjectURL(bb.getBlob());
    console.log('URL: ', url);
};
xhr.open('GET', 'http://example.com/favicon.ico');
xhr.send();

（如果要对Firefox使用相同的代码，请使用window.URL和MozBlobBuilder ）。