大数据最全Vue 前端导出、下载zip excel文件流blob_vue new blob 大量数据

//普通代码
axios.post(postUrl, params, {responseType: 'arraybuffer'}).then(res => {
    // 创建Blob对象，设置文件类型
    let blob = new Blob([res.data], {type: "application/vnd.ms-excel"})
    let objectUrl = URL.createObjectURL(blob) // 创建URL
    location.href = objectUrl;
    URL.revokeObjectURL(objectUrl); // 释放内存
})

downloadAll() {
      axios({
        method: "get",
        url: "api/TemplateDownload/GetAllTemplateZIP",
        headers: {
          "content-type": "application/json; charset=utf-8",
          Authorization: Cookies.get("token") || "",
        },
        responseType: "blob",
      })
        .then((response) => {
          let blob = new Blob([response.data], { type: "application/zip" });
          let url = window.URL.createObjectURL(blob);
          const link = document.createElement("a"); // 创建a标签
          link.href = url;
          link.download = "模板下载"; // 重命名文件
          link.click();
          URL.revokeObjectURL(url); // 释放内存
          this.checkList = [];
        })
        .catch((error) => {
          console.log(error.data);
        });
        
    },


//excel 
let blob = new Blob([response.data], { type: "application/vnd.ms-excel" });

dl() {
      axios({
        method: "get",
        url: "http://10.180.170.3:8794/tRptMwStdClt/exportData?time=202104",
        responseType: "arraybuffer",
      })
        .then((response) => {
          console.log(response);
          let blob = new Blob([response.data], {
            type: "application/vnd.ms-excel",
          });
          let url = window.URL.createObjectURL(blob);
          const link = document.createElement("a"); // 创建a标签
          link.href = url;
          link.download = "模板下载"; // 重命名文件
          link.click();
          URL.revokeObjectURL(url); // 释放内存
          this.checkList = [];
        })
        .catch((error) => {
          console.log(error.data);
        });
    },

获取到了后台传过来的excel文件 前端用vue怎么接收并导出？ - 中文 - Vue Forum

vue.js前端实现excel表格导出和获取headers里的信息 - 五个半柠檬 - OSCHINA - 中文开源技术交流社区

java后台需要设置

 response.addHeader("Content-Disposition", "attachment;filename=" + fileName + ".xlsx");
 response.setHeader("Access-Control-Expose-Headers","Content-Disposition");

才能获取到文件名等信息

 // 导出execel2


![img](https://img-blog.csdnimg.cn/img_convert/454c9fe9fb2fa690cdc5e1ff2d341b35.png)
![img](https://img-blog.csdnimg.cn/img_convert/adcd314c7c60fc4a71592322f16639ff.png)

**网上学习资料一大堆，但如果学到的知识不成体系，遇到问题时只是浅尝辄止，不再深入研究，那么很难做到真正的技术提升。**

**[需要这份系统化资料的朋友，可以戳这里获取](https://bbs.csdn.net/topics/618545628)**


**一个人可以走的很快，但一群人才能走的更远！不论你是正从事IT行业的老鸟或是对IT行业感兴趣的新人，都欢迎加入我们的的圈子（技术交流、学习资源、职场吐槽、大厂内推、面试辅导），让我们一起学习成长！**

**一个人可以走的很快，但一群人才能走的更远！不论你是正从事IT行业的老鸟或是对IT行业感兴趣的新人，都欢迎加入我们的的圈子（技术交流、学习资源、职场吐槽、大厂内推、面试辅导），让我们一起学习成长！**