使用npm i jszip、npm i file-saver、npm i axios安装插件
1、下载文件流:
import JSZip from 'jszip'import FileSaver from 'file-saver'import axios from 'axios'const getFile = url => {return new Promise(async (resolve, reject) => {const obj = {method: 'get',url,responseType: 'arraybuffer'}try {const data = await axios(obj)resolve(data.data)} catch (error) {reject(error.toString())}})}
2、打包成zip进行下载:
const data = [] // 文件路径数组const zip = new JSZip()const cache = {}const promises = []this.isDowning = truedata.forEach((item, index) => {const promise = getFile(item).then(data => {const file_name = `文件-${index + 1}` // 获取文件名zip.file(file_name, data, { binary: true }) // 逐个添加文件cache[file_name] = dataconsole.log(cache)})promises.push(promise)})Promise.all(promises).then(() => {zip.generateAsync({ type: 'blob' }).then(content => {console.log(content)// 生成二进制流FileSaver.saveAs(content, '文件下载.zip') // 利用file-saver保存文件 自定义文件名this.isDowning = false})})