图片批量下载并打包成zip

最新推荐文章于 2022-12-21 11:38:34 发布

原创

最新推荐文章于 2022-12-21 11:38:34 发布 · 1.2k 阅读

1 ·

CC 4.0 BY-SA版权

文章标签：

#js #html #jquery

这段代码展示了如何使用FileSaver.js和jszip.min.js库来批量下载和打包点餐二维码图片。首先，获取每个二维码的base64编码，然后创建一个ZIP文件，将所有二维码图片存入文件夹中，最后生成ZIP文件并下载。处理过程中提供了进度更新和异常处理。

需要引入两个js文件：

<script src="__STATIC__/js/FileSaver.js"></script>
<script src="__STATIC__/js/jszip.min.js"></script>

js文件下载地址：
链接：https://pan.baidu.com/s/19mF3BqFBJ3OMj6G_0bXm2g
提取码：1q2w

下边传入的图片数据格式data数据格式：
在这里插入图片描述
//用到的图片信息只有：

gz_qrcode

下边是具体的代码实现

function packageImages(data) {
   
   
    $('#status').text('处理中。。。。。');
    var url = window.location.protocol+"//"+window.location.host;//图片路径
    var imgsSrc = [];
    var imgBase64 = [];
    var imageSuffix = [];//图片后缀
    var zip = new JSZip();
    var img = zip.folder(<