Appearance
网页多文件合并下载成zip
一般网页上都是一个文件一个文件的下载。下载代码也比较简单。
javascript
function downloadImage(filename, data) {
var link = document.createElement('a');
link.href = data;
link.download = filename;
link.click();
}
但是有的时候又想下载多个文件或者图片,那么这个时候就想跟一些设计网站或者工具网站一样,直接打一个zip包,然后单独下载zip包还挺好的。毕竟浏览器不能直接把多个文件下载到一个文件夹下。
然后找了找发现了 jszip 这个库,还是挺符合需求的。文档地址
用法如下:
javascript
const zip = new JSZip();
zip.file("Hello.txt", "Hello World\n");
const folder = zip.folder("images");
folder.file("image.png", imgData, {base64: true});
zip.generateAsync({type:"blob"}).then(function(content) {
downloadBlob(content, "example.zip");
});
function downloadBlob(blob, filename) {
var url = URL.createObjectURL(blob)
var link = document.createElement('a')
link.href = url
link.download = filename
link.click();
}
这下子就能直接把很多文件打包成一个文件下载了,浏览器下载zip一般还会有自动解压功能,还是非常方便的。