批量下载二维码,并打包压缩

选择相应的图片批量导出或直接批量导出并压缩在一个文件夹里

思路分析
1.先将选中二维码的地址存在一个数组中
2.依次请求图片并将其下载
3.后用jszip压缩文件
4.最后用file-saver生成文件

实现代码:

import JSZip from "jszip";
import FileSaver from "file-saver";
import axios from "axios";

getFile = (url) => {
    return new Promise((resolve, reject) => {
      axios({
        method: 'get',
        url,
        responseType: 'arraybuffer'
      }).then(data => {
        resolve(data.data)
      }).catch(error => {
        reject(error.toString())
      })
    })
  };

  // 批量下载
  handleBatchDownload = async(selectImgList) => {
    const data = selectImgList;
    const zip = new JSZip()
    const cache = {}
    const promises = []
    await data.forEach(item => {
        const promise = this.getFile(item).then(data => { // 下载文件, 并存成ArrayBuffer对象
        const arr_name = item.split("/");
        let file_name = arr_name[arr_name.length - 1] // 获取文件名
        if (file_name.indexOf('.png') == -1) {
          file_name = file_name + '.png'
        }
        zip.file(file_name, data, {
          binary: true
        }) // 逐个添加文件
        cache[file_name] = data
      })
      promises.push(promise)
    })
    Promise.all(promises).then(() => {
      zip.generateAsync({
        type: "blob"
      }).then(content => { // 生成二进制流
        FileSaver.saveAs(content, "photo.zip") // 利用file-saver保存文件
      })
    })
  };

上述输入selectImgList是选择批量导入的图片链接数组。
https://www.npmjs.com/package/file-saver
https://www.npmjs.com/package/jszip

参考文档:
https://segmentfault.com/a/1190000018234223

你可能感兴趣的:(批量下载二维码,并打包压缩)