Question

我正在使用JSZip在页面上捆绑一组图像并创建一个zip文件来存储它们。这是相关功能：

// Make a zip file
$("#snapLink").click(function() {
  var zip = new JSZip();
  snapFolder = zip.folder("snaps")
  $("#snapRandom img").each( function(index){
    imageLink = $(this).attr('src').substring(22);
    snapFolder.file("snap" + index + ".png", imageLink, {base64: true});
  })
  snapZip = zip.generate();
  location.href="data:application/zip;base64,"+snapZip;
});

图像是从画布生成的，因此它们不在文件系统中。图像源是数据URL。

如果要下载1-3张图像，这个效果很好。一旦有超过10个以上的图像浏览器崩溃，它肯定会崩溃。到目前为止，我已经在Mac和Safari上测试过这款游戏。图像大约是120k。

您对如何使这项工作有任何想法吗？提前谢谢！

Answer 1

我有同样的问题，以防其他人在想，我在这里发布解决方案。

答案实际上在网站上：https://stuk.github.io/jszip/documentation/howto/write_zip.html

zip.generateAsync({type:"blob"})
.then(function (blob) {
    saveAs(blob, "hello.zip");
});

就这么简单。包含FileSaver.js并使用blob而不是base64。

错误是由href上的字符限制引起的。

chrome中的当前网址长度限制为2097152个字符

我最初认为我们必须使用base64来保存zip文件，因为图像是在base64中。值得庆幸的是，我们可以将其保存为blob并克服1.5Mb-ish限制

使用JSZip下载崩溃浏览器的图像

1 个答案: