后端将图片地址返回过来 前端进行压缩处理

首先 安装jszip这个插件

const getFile = url => {

   return new Promise((resolve, reject) => {

      //通过请求获取文件blob格式

      let xmlhttp = new XMLHttpRequest();

      xmlhttp.open("GET", url, true);

      xmlhttp.responseType = "blob";

      xmlhttp.onload = function () {

         if (this.status == 200) {

            resolve(this.response);

         } else {

            reject(this.status);

         }

      }

      xmlhttp.send();

   });

};

后面这个要使用第一个.then将后端返回的数据接收过来第二个.then后面跟这些代码

  if (this.code == 1) {

               return false

            }

               let data = this.imglist  //这个就是接收后端的数据

               const zip = new JSZip();

               const cache = {};

               const promises = [];

               var i = 0;

               data.forEach(item => {

                  const promise = getFile(item.link).then(data => {

                     var imgname = item.link.split(".")

                     // 下载文件, 并存成ArrayBuffer对象

                     zip.file(item.name + "." + imgname[imgname.length - 1], data, { binary: true }); // 逐个添加文件

                     cache[item.name] = data;

                  });

                  promises.push(promise);

               });

               Promise.all(promises).then(() => {

                  zip.generateAsync({ type: "blob" }).then(content => {

                     // 生成二进制流

                     FileSaver.saveAs(content, this.imgtitle + ".zip"); // 利用file-saver保存文件  自定义文件名

                  });

               });