我使用JSzip创建包含所有图像文件的zipfile。我使用XMLHttpRequest从循环内的外部链接获取图像。根据我的代码zipfile创建完成之前的XMLHttpRequest。所以它返回空的zip文件。循环所有文件后如何创建zip文件?
$this->dataArray['name']
答案 0 :(得分:2)
JSZip支持promises作为内容:您可以将每个HTTP调用包装到promises中,而不是显式等待。
第一个函数downloadUrlAsPromise
将xhr调用包装成Promise。第二个函数downloadFirebaseImage
将getDownloadURL
的承诺与第一个函数的承诺联系起来。结果是对xhr内容的承诺。
一旦你拥有了这个,你就可以直接向JSZip提供承诺:
zip.file(i+".png", downloadFirebaseImage(imagePath));
完整方法:
function downloadUrlAsPromise (url) {
return new Promise(function (resolve, reject) {
var xhr = new XMLHttpRequest();
xhr.open('GET', url, true);
xhr.responseType = "arraybuffer";
xhr.onreadystatechange = function(evt) {
if (xhr.readyState === 4) {
if (xhr.status === 200) {
resolve(xhr.response);
} else {
reject(new Error("Ajax error for " + url + ": " + xhr.status));
}
}
});
xhr.send();
});
}
function downloadFirebaseImage(storageRef, path) {
var starsRef = storageRef.child(imagePath);
return starsRef.getDownloadURL().then(function(url) {
return downloadUrlAsPromise(url);
});
}
// ...
for (i = 1; i <= count; i++) {
console.log(path+i+".png");
var imagePath = path+i+".png";
zip.file(i+".png", downloadFirebaseImage(imagePath));
}
zip.generateAsync({type:"blob"})
.then(function(content) {
// see FileSaver.js
saveAs(content, "my.zip");
});