JSZip库的简单使用

2021-08-31

【JSZip库的简单使用】官方网址：
JSZip

jszip是一个用于创建、读取和编辑.zip文件的JavaScript库，且API的使用也很简单。

安装

npm install jszip

需用到jszip/dist下的jszip.min.js文件以及jszip/vendor下的FileSaver.js文件
引入将js文件放到jszip文件夹下

>

官方示例

var zip = new JSZip(); zip.file("Hello.txt", "Hello World\n"); var img = zip.folder("images"); img.file("smile.gif", imgData, {base64: true}); zip.generateAsync({type:"blob"}) .then(function(content) { // see FileSaver.js saveAs(content, "example.zip"); });

创建一个JSZip实例：

var zip = new JSZip();

使用.file(fileName,fileContent)添加一个txt文件

zip.file("Hello.txt", "Hello World\n");

使用.folder(folderName)添加一个文件夹

var img = zip.folder("images");

使用.file(fileName,fileContent,base64FLag)在文件夹下添加一个图片文件

img.file("smile.gif", imgData, {base64: true});

注：fileContent可以是File文件也可以是Blob二进制数据

生成一个zip文件

zip.generateAsync({type:"blob"}) .then(function(content) { // see FileSaver.js saveAs(content, "example.zip"); });

type:"blob" 压缩的结果为二进制流,可用作文件上传
saveAs(content, "example.zip"); 直接在浏览器打成example.zip包并下载，saveAs依赖的js是FileSaver.js

推荐阅读

上一篇：2021-05-24

下一篇：学习，真是一件美而不腻的事情