vue根据后台返回文件流转换为zip

因为是文件流下载，所以在取后台数据的时候，要多传递一个【responseType: ‘blob’】这个参数

 

后端返回的文件流：

代码如下： 

    reportTable(val) {
      this.$axios.service({
        method: "post",
        url: '/test/downloadZip',
        data: {reportAllotMonthId:val.id,name:val.reportFormName,month:val.month},
        headers: {
          "content-type": "application/json; charset=utf-8",
          token: sessionStorage.getItem("cmsUser")
            ? JSON.parse(sessionStorage.getItem("cmsUser")).tokenId
            : ""
        },
        responseType: "blob"
      })
      .then(res => {
        this.downloadFile(res.data);
      })
      .catch(res => {
        this.downloadFile(res.data);
      });
    },
    // 导出
    downloadFile(data) {
      let blob = new Blob([data], {type: 'application/zip'})
      let url = window.URL.createObjectURL(blob)
      const link = document.createElement('a') // 创建a标签
      link.href = url
      link.download = `导出${utils.getTimeString(new Date())}` // 重命名文件
      link.click()
      URL.revokeObjectURL(url) // 释放内存
    },