vue axios下载文件流

vue项目中接受后台传过来的流文件会出现乱码

后台response的内容如下:

在参考各位大大资料的基础下,做了点总结。

// 导出文件流
  fetchExportBill(url, data = {}) {
    return new Promise((resolve, reject) => {
      axios.post(url,data,{ responseType: 'arraybuffer'}).then(res => {
      //resolve(res)
      let blob = new Blob([res], {type: "application/vnd.ms-excel"}); 
  let objectUrl = URL.createObjectURL(blob); 
   window.location.href = objectUrl; 
      }).catch(error => {
        if (data.Vue) {
          data.Vue.$message.error('系统异常');
        }
        reject(null, e);
      })
    })
  },

带文件名字的:

  let blob = new Blob([res.data], { type: "application/zip" });
            let url = window.URL.createObjectURL(blob);
            const link = document.createElement("a"); // 创建a标签
            var fileName = res.headers.filename;
            var fileNameStr = res.headers["content-disposition"] + "";
            var index = fileNameStr.indexOf("=");
            if (index > 0) {
              fileName = fileNameStr.substr(index + 1);
              fileName = decodeURIComponent(fileName);
            }
            link.href = url;
            link.download = fileName; // 重命名文件
            link.click();
            URL.revokeObjectURL(url); // 释放内存

 注:Blob对象的type为MIME类型

posted @ 2022-02-07 14:36  土小狗  阅读(121)  评论(0编辑  收藏  举报