JSZip的使用，向前端发送Zip包

业务场景

由于浏览器的自我保护机制，open.window只能发送一个请求，在此情况下需向前端发送多个文件或多个数据。即交互一次，多次响应。

引入

npm i jszip

前言

什么是buffer流？在传统的前端我们只需要做一些Unicode编码字符串处理，而在node中我们需要buffer来处理后端向前端传送的二进制数据。

后端JS代码（buffer流传输）

  generateExcelZip(`批量导出数据`, bufferZip, response)  //bufferZip为对象包数组形式
  async generateExcelZip(fileName, buffer, response) {
    response.implicitEnd = false //将浏览器默认配置取消
    var zip = new JSZip()  //创建一个zip
    var zipFile = zip.folder(fileName)  //创建文件夹
    buffer.map((i, v) => {
      zipFile.file(`${i.excelName}.xlsx`, i.buffer)
    })
    zip.generateAsync({ type: 'nodebuffer' }).then((content) => {
      //设置头信息
      response.response.setHeader('Content-Type', 'application/zip')   //申明类型为zip
      response.response.setHeader('Content-Disposition', `attachment;filename=package.zip`)
      const bufferStrream = new PassThrough() 
      bufferStrream.end(content)
      bufferStrream.pipe(response.response)
    })
  }, 

后面还会持续更新，欢迎下方评论区留言，下期见

作者：琉璃Diaspora

标签：Zip,zip,buffer,前端,JSZip,bufferStrream,response
来源： https://blog.csdn.net/weixin_51037408/article/details/121437506