I am using JSZip and I am creating a .zip file with several .xml files inside it as shown below:

// 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;
});

The .zip file is created and downloaded perfectly but the name of the file is the default "download file". What i want to do is give a name to this file at will (for example allXMLs.zip).

I looked at the JSZip documentation but I did not find anything really enlightening, any help would be greatly appreciated.

I am using JSZip and I am creating a .zip file with several .xml files inside it as shown below:

// 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;
});

The .zip file is created and downloaded perfectly but the name of the file is the default "download file". What i want to do is give a name to this file at will (for example allXMLs.zip).

I looked at the JSZip documentation but I did not find anything really enlightening, any help would be greatly appreciated.

• javascript
• zip
• jszip

Share Improve this question Follow edited Jun 18, 2019 at 15:24 NickAth asked Jun 18, 2019 at 15:21 NickAthNickAth 1,11211 gold badge1818 silver badges4040 bronze badges 3

• 1 On the page you linked, the example's function saveAs has a second parameter, which is the file name. So I would think you need to write the file out to disk in order to name it. – Tanner Commented Jun 18, 2019 at 15:24
• Hi Tanner, the saveAs function belongs to FileSaver.js which I do not currently have included on my project, I wonder if there is a way without including it – NickAth Commented Jun 18, 2019 at 15:34
• 1 FileSaver.saveAs just creates an <a> element and sets it's download attribute. @JordanBurnett has posted the short version of it – Andreas Commented Jun 18, 2019 at 15:37

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 8

You could create an anchor tag with a 'download' attribute that would allow you some control over the filename.

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);
});

In the documentation, it suggests an additional library called [FileSaver.js].1 See here for the example given in the projects How To.