我正在尝试使用jsZip创建一个zip文件.zip文件的内容是来自网络的图像.我创建了以下代码.但是当我运行它时,我得到的是一个22kb的空zip文件.
<html>
<head>
</head>
<body>
<script type="text/javascript" src="jszip.js"></script>
<script type="text/javascript" src="FileSaver.js"></script>
<script type="text/javascript" src="jszip-utils.min.js"></script>
<script>
var imgLinks=["url1", "url2", "url3"];
function create_zip()
{
var zip=new JSZip();
for(var i=0; i<imgLinks.length; i++)
{
JSZipUtils.getBinaryContent(imgLinks[i], function (err, data) {
if(err) {
alert("Problem happened when download img: " + imgLink[i]);
console.erro("Problem happened when download img: " + imgLink[i]);
deferred.resolve(zip); // ignore this error: just logging
// deferred.reject(zip); // or we may fail the download
} else {
zip.file("picture"+i+".jpg", data, {binary:true});
deferred.resolve(zip);
}
});
}
var content = zip.generate({type:"blob"});
saveAs(content, "downloadImages.zip");
}
</script>
<br/>
<br/>
<center>
Click the button to generate a ZIP file
<br/>
<input id="button" type="button" onclick="create_zip()" value="Create Zip"></input>
</center>
</body>
</html>
(url1,url2和url3替换为我想下载的图片网址).
为什么我会得到这些空的zip文件？
JSZipUtils.getBinaryContent是异步的：内容将在调用后添加zip.generate()。在生成 zip 文件之前，您应该等待所有图像。
编辑 ：
如果您正在加载的文件位于不同的服务器上，则该服务器需要发送额外的 HTTP 标头，例如Access-Control-Allow-Origin: server-hosting-the-page.com. 在这种情况下，Firefox 或 Chrome 调试控制台将显示错误。js 库无法检测到CORS问题（请参阅此处），并且会以空内容触发成功。
| 归档时间： |
|
| 查看次数： |
6333 次 |
| 最近记录： |