vue axios post形式下载zip文件流_vuezip的流文件名称，前端开发练习

最新推荐文章于 2024-09-27 15:27:45 发布

2401_87288714

最新推荐文章于 2024-09-27 15:27:45 发布

阅读量108

点赞数 2

文章标签： vue.js javascript ecmascript

本文链接：https://blog.csdn.net/2401_87288714/article/details/142504012

版权

      "Content-Type": "application/x-www-form-urlencoded"
    },
    responseType: "blob" // 下载zip文件需要使用的响应格式,这是区别于普通post请求的地方,重点!!!
  })
  .then(response => {
    var zipName = "Bulk\_Download"; // 下载的文件名
    let blob = new Blob([response.data], { type: "application/zip" }); // 下载格式为zip
    if ("download" in document.createElement("a")) {
       非IE下载
      let elink = document.createElement("a"); // 创建一个<a>标签
      elink.style.display = "none"; // 隐藏标签
      elink.href = window.URL.createObjectURL(blob); // 配置href
      elink.download = zipName;
      elink.click();
      URL.revokeObjectURL(elink.href); // 释放URL 对象
      document.body.removeChild(elink); // 移除<a>标签
    } else {
      //IE10+
      navigator.msSaveBlob(blob, zipName);
    }
  })
  .catch(error => {
    console.log("download error (batch)");
    console.log(error);
  });

}


**如果是单独下载, 可以使用window.open()方法进行下载, 默认window.open会在浏览器中打开一个新的标签页, 不是很友好, 这里配置的"\_self"就是在当前标签页打开下载, 还是比较有好的**

window.open( “/api/download/” , “_self” );


**当然当前页打开页面的方法还有很多, 自己选择一个喜欢的就可以**

self.location.href=“/url” // 当前页面打开URL页面
location.href=“/url” // 当前页面打开URL页面
windows.location.href=“/url” // 当前页面打开URL页面，前面三个用法相同。
this.location.href=“/url” // 当前页面打开URL页面
parent.location.href=“/url” // 在父页面打开新页面
top.location.href=“/url” // 在顶层页面打开新页面


**又是没有bug的一天 美滋滋**



**对象篇**

![](https://imgconvert.csdnimg.cn/aHR0cHM6Ly91cGxvYWQtaW1hZ2VzLmppYW5zaHUuaW8vdXBsb2FkX2ltYWdlcy82MTY4MzU2LWIxMTdmNzMyNDJlZjAyMDM?x-oss-process=image/format,png)

![](https://imgconvert.csdnimg.cn/aHR0cHM6Ly91cGxvYWQtaW1hZ2VzLmppYW5zaHUuaW8vdXBsb2FkX2ltYWdlcy82MTY4MzU2LWU5ZGY5NGRhODZhZGZjNjY?x-oss-process=image/format,png)

**模块化编程-自研模块加载器**



![](https://imgconvert.csdnimg.cn/aHR0cHM6Ly91cGxvYWQtaW1hZ2VzLmppYW5zaHUuaW8vdXBsb2FkX2ltYWdlcy82MTY4MzU2LWUyNWEzOGRhNTU1NTBmOGY?x-oss-process=image/format,png)



![](https://imgconvert.csdnimg.cn/aHR0cHM6Ly91cGxvYWQtaW1hZ2VzLmppYW5zaHUuaW8vdXBsb2FkX2ltYWdlcy82MTY4MzU2LTQ5MGM2MTlhOTI5YjY3Y2U?x-oss-process=image/format,png)