关于JSZIP压缩图片打包下载的一些用法

1
2
3
4
5
6
7
8
var zip = new JSZip();
zip.file("Hello.txt", "Hello Worldn");
var img = zip.folder("images");
img.file("smile.gif", imgData, { base64: true });    //imgData为图片文件
zip.generateAsync({ type: "blob" })
	.then(function (content) {
  	FileSaver.saveAs(content, "example.zip");  
	});

1
2
3
4
5
6
7
var zip = new JSZip();
//导出的文件内有一个hello.txt文件，内容为hello world
zip.file("Hello.txt", "Hello Worldn"); 
zip.generateAsync({ type: "blob" })
	.then(function (content) {
  	FileSaver.saveAs(content, "example.zip");  
});

1
2
3
4
5
6
7
var zip = new JSZip();
//打开后为hellow world
zip.file("Hello.txt", "aGVsbG8gd29ybGQK", { base64: true });
zip.generateAsync({ type: "blob" })
 	.then(function (content) {
  		FileSaver.saveAs(content, "example.zip");
	});

1
2
3
4
5
6
7
8
var zip = new JSZip();
zip.file("hello.txt", "unicode ♥", { binary: false }); 
//binary为false时，特殊符号代码导出为乱码形式
zip.file("hello.txt", "unicode xE2x99xA5", { binary: true });  
zip.generateAsync({ type: "blob" })
    .then(function (content) {
        FileSaver.saveAs(content, "example.zip");
    });

1
2
3
4
5
6
7
8
9
var zip = new JSZip();
zip.file("hello.txt", "unicode xE2x99xA5", {
    binary: true,
    date: new Date("October 25, 2022 17:39:01")  //导出的文件最后求改日期为2022-10-25
});
zip.generateAsync({ type: "blob" })
    .then(function (content) {
        FileSaver.saveAs(content, "example.zip");
  });

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
var zip = new JSZip();
zip.file("hello.txt", "unicode xE2x99xA5", {
    binary: true,
    date: new Date("October 25, 2022 17:39:01")
});
zip.generateAsync({
    type: "blob",   //压缩类型
    compression: "STORE",
    compressionOptions: {  // STORE：默认不压缩 DEFLATE：需要压缩
        level: 1    // 压缩等级1~9    1压缩速度最快，9最优压缩方式  
      							// [使用一张图片测试之后1和9压缩的力度不大，相差100字节左右]
    }
})
    .then(function (content) {
        FileSaver.saveAs(content, "example.zip");
    });

1
2
3
4
5
6
7
8
9
10
11
var zip = new JSZip();
zip.file("hello.txt", "unicode xE2x99xA5", {
    binary: true,
    comment: "测试文件hello"
});
zip.generateAsync({
    type: "blob",   //压缩类型
})
    .then(function (content) {
        FileSaver.saveAs(content, "example.zip");
    });

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
zip.file("a/b/c/d.txt", "content", {
    createFolders: true // default value
});
console.log(zip.files);
// will display:
// - a/
// - a/b/
// - a/b/c/
// - a/b/c/d.txt


zip.file("a/b/c/d.txt", "content", {
    createFolders: false
});
console.log(zip.files);
// will display:
// - a/b/c/d.txt

1
2
3
4
5
6
7
8
9
10
11
12
13
var zip = new JSZip();
zip.file("a/b.txt", "unicode xE2x99xA5", {
    binary: true,
    dir: true
});
zip.generateAsync({
    type: "blob",   //压缩类型
}, (Update) => {
    console.log(Update);
})
    .then(function (content) {
        FileSaver.saveAs(content, "example.zip");
    });

1
2
3
4
5
6
7
var zip = new JSZip();
const hello = zip.folder("hello")  //压缩包下新建一个hello的文件夹
hello.file("Hello.txt", "Hello Worldn");
zip.generateAsync({ type: "blob" })
	.then(function (content) {
  	FileSaver.saveAs(content, "example.zip");  
});

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
  //导出
    export = () => {
        const { fileList } = this.state
        message.info({ content: "图片正在压缩导出，请稍等...", key: 'export', duration: 0 })
        this.toZip(fileList, fileList.map(e => e.name))
    }

    toZip = (imgSrcList, fileName) => {
        //筛选要分类的文件名，由于文件名可能出现重复，所以筛选去重(这里是根据地理位置分类命名文件名)
        let ExportTitle = imgSrcList.map((item) => {
            return item.classInfo ? item.classInfo : "暂无小班定位信息"
        })
        let newExportTitle = ExportTitle.filter((item, index, arr) => {
            return arr.indexOf(item) == index;
        })
        let zip = new JSZip();  //实例化一个压缩文件对象
        let myNotesName = '导出结果';
        let imgFolder = newExportTitle.map((e) => {
            return zip.folder(e); //新建一个图片文件夹用来存放图片，参数为文件名
        })

        for (let i = 0; i < imgSrcList.length; i++) {
            let image = imgSrcList[i].shuiYinFile
            let imageNames = `${fileName[i]}.png`;
            imgFolder.forEach(element => {
                if (imgSrcList[i].classInfo === element.root.replace('/', "")) {
                    element.file(imageNames, image, { base64: false })
                } else if (element.root.replace('/', "") === "暂无小班定位信息") {
                    element.file(imageNames, image, { base64: false })
                }
            });
        }
        zip.generateAsync({
            type: "blob",//压缩类型
            compression: "DEFLATE",   // STORE：默认不压缩 DEFLATE：需要压缩
            compressionOptions: {
                level: 1  // 压缩等级1~9    1压缩速度最快，9最优压缩方式  // [使用一张图片测试之后1和9压缩的力度不大，相差100字节左右]
            },
        }).then(function (content) {
            message.success({ content: "压缩包导出成功", key: 'export', duration: 3 })
            FileSaver.saveAs(content, `${myNotesName}.zip`);
        });
    }