由JSZip创建的zip文件应该命名为什么？

Question

我正在使用JSZip创建一个包含多个.xml文件的.zip文件，如下所示：

// get each xml in string format and add it to zip object
let zip = new JSZip();
for(let i = 0; i < containers.length; i++){
    let xml = getXML(i);
    zip.file("file"+i+".xml", xml);
}

// download the .zip file
zip.generateAsync({
    type: "base64"
}).then(function(content) {
    window.location.href = "data:application/zip;base64," + content;
});

虽然.zip文件可以完美创建和下载，但是文件名却是默认的“download file”。我想要做的是随意命名该文件（例如allXMLs.zip）。

我查看了JSZip文档，但没有找到真正有启发性的内容，非常感谢您的帮助。

- NickAth

---

在你提供的页面上，示例中的函数saveAs有一个第二个参数，它是文件名。因此我认为你需要将文件写入磁盘以便命名。 - Tanner

嗨 Tanner，saveAs 函数属于 FileSaver.js，目前我在我的项目中尚未包含它。我想知道是否有一种方法可以不包含它。 - NickAth

FileSaver.saveAs 只是创建了一个 <a> 元素并设置了它的 download 属性。@JordanBurnett 已经发布了它的简短版本。 - Andreas

Answer 1

你可以创建一个带有“下载”属性的锚标记，从而允许你对文件名进行一些控制。

zip.generateAsync({
    type: "base64"
}).then(function(content) {
    var link = document.createElement('a');
    link.href = "data:application/zip;base64," + content;
    link.download = "your-file-name.zip";
    document.body.appendChild(link);
    link.click();
    document.body.removeChild(link);
});

- Jordan Burnett

---

嗨Jordan，感谢您的回复，确实使用带有下载属性的锚标签可以让我控制文件名，但我想知道库本身是否有任何开箱即用的解决方案。无论如何，您的建议非常有帮助。+1 :) - NickAth

快速查看 fileSaver.js 可以发现这也是他们使用的方法 :) - Jordan Burnett

@NickAth：“但我想知道这个库本身是否有任何开箱即用的解决方案” -> 没有：https://github.com/Stuk/jszip/blob/master/documentation/howto/write_zip.md - Andreas

@Andreas 谢谢您的回复，我会按照临时锚标签的方式进行操作，而不是像Jordan建议的那样在我的系统中包含整个库。 - NickAth

Answer 2

在文档中，它建议使用一个名为 [FileSaver.js] 的额外库。1 请参阅该项目的 How To 中给出的示例 here。

- Sprawl63

---

帮助中心 - 回答问题 -> 为链接提供上下文: "鼓励提供外部资源的链接，但请在链接周围添加上下文，以便您的同行用户了解它是什么以及为什么存在。始终引用重要链接的最相关部分，以防目标站点无法访问或永久离线。" - Andreas