前端文件流下载

最新推荐文章于 2024-09-30 15:42:36 发布

zmyalh

最新推荐文章于 2024-09-30 15:42:36 发布

阅读量104

点赞数

分类专栏：文件流文章标签：前端 javascript

本文链接：https://blog.csdn.net/zmyalh/article/details/128953175

版权

文件流专栏收录该内容

1 篇文章 0 订阅

订阅专栏

该文章描述了如何在前端使用axios库处理后台返回的文件流进行下载。通过设置responseType为blob，将文件流转换为blob对象，然后创建隐藏的a标签，设定href为文件URL并触发点击下载。同时，文章提到了如何处理文件名和防止乱码问题。

摘要由CSDN通过智能技术生成

前端文件流下载

后台返回文件流，前端获取文件流下载

  downLoad  (url) {
      this.$axios.post(url,  {
        //返回后台的参数数据
      },{responseType:'blob'}).then(data=>{
        if(data){
          const blob = data.data;//获取文件流
          let link = document.createElement("a");
          link.href = URL.createObjectURL( new Blob([blob], { type: data.request.response.type }) );
          // data.request.response.type 获取文件格式
          link.download = JSON.parse(data.config.data).originalname;//获取文件名字
          document.body.appendChild(link);
          link.click();
          URL.revokeObjectURL(link.href);
        }
      }).catch(error => {
       console.error(error)
      });
    }