axios get请求下载后端文件流xlsx文件

柔情只为你懂 2024-03-26 20:10 91阅读 0赞

const res = await axios({
        
            method: 'get',
            url: `/exportData`,
            params: {
        
              id: this.id,
            },
            responseType: 'blob',
          });
          if(!res.data) return
          // 获取响应头Content-Disposition中的filename参数,后端需要设置
          const fileNameEncode = res.headers['content-disposition'].split('filename=')[1];
          // 注意，默认 Content-Disposition 只支持 ASCII 字符
          // 要么让后端返回时先 encodeURIComponent 一次这个文件名，都变成 ASCII 字符；前端收到后再 decodeURIComponent 回来
          // 要么让后端返回时指定 charset（如 UTF-8）
          // 文章：https://segmentfault.com/q/1010000041071262
          const fileName = decodeURI(fileNameEncode, 'utf-8');
          const blob = new Blob([res.data]);
          // 根据响应值设置
          // const blob = new Blob([res.data], {
        
          // type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet',
          // });
          const url = URL.createObjectURL(blob);
          const link = document.createElement('a');
          link.style.display = 'none';
          link.setAttribute('href', url);
          link.setAttribute('download', fileName);
          link.click();
          URL.revokeObjectURL(a.href); // 释放URL对象

发表评论取消回复

表情：

评论列表（有 0 条评论，91人围观）

还没有评论，来说两句吧...

相关阅读

相关 axios get请求下载后端文件流xlsx文件

const res = await axios({ method: 'get', url: `/exp

柔情只为你懂/ 2024年03月26日 20:10/ 0 赞/ 92 阅读

相关 axios 请求下载excel文件

　　前端　　window.Axios.post(window.ApiName.excelExport, params ,\{ responseType: 'blob' \}

﹏ヽ暗。殇╰゛Y/ 2023年09月24日 07:45/ 0 赞/ 168 阅读

相关 axios下载文件

前言最近项目将token信息放在请求的header中，所以不可以用iframe的src属性下载文件，因为不可以操作请求头。这里记录一下使用axios实现文件下载的方法。

喜欢ヅ旅行/ 2023年06月30日 09:22/ 0 赞/ 33 阅读

相关 Postman使用POST请求上传文件，GET请求下载文件

一、GET请求下载文件如下图选择 Send and Download 即可下载文件 ![在这里插入图片描述][watermark_type_ZmFuZ3poZW5n

我不是女神ヾ/ 2023年06月09日 12:28/ 0 赞/ 73 阅读

相关 vue中axios实现下载excel表格功能(下载后端返回的文件流)

之前遇到一个问题：就是做下载excel表格功能时，不知道怎么把后端返回的文件流转化成表格，上网看了很多方法，可能自己没有找对吧，确实可以实现下载，但是下载的表格内容是乱码，个人

阳光穿透心脏的1/2处/ 2023年03月04日 11:25/ 0 赞/ 158 阅读

相关 vue axios ts 封装流文件下载方法

vue axios ts 封装流文件下载方法 // 定义文件下载的接口 interface DOWNFILETYPE { url: st

怼烎@/ 2023年01月06日 01:16/ 0 赞/ 255 阅读

相关 vue axios ts 封装流文件下载方法

vue axios ts 封装流文件下载方法 // 定义文件下载的接口 interface DOWNFILETYPE { url: st

￡神魔★判官ぃ/ 2022年11月19日 12:44/ 0 赞/ 383 阅读

相关 react前端下载后端返回文件流(文件流下载excel、csv)

以前用vue框架的时候，写过不少下载上传的东西，当然包括后端返回文件流供前端下载，现在用react，牵扯到这个功能，又提起来说，有两种下载类型，一种是Excel，一种是Csv。

水深无声/ 2022年11月06日 06:59/ 0 赞/ 624 阅读

相关 Axios POST 下载文件；HTTP GET下载文件

1.遇到的问题 1）通过Post下载文件，发现服务网关（Kestrel）不允许添加响应头（未解决）请求接口时候的配置： exportSchemeDetail

拼搏现实的明天。/ 2022年09月09日 04:36/ 0 赞/ 249 阅读

相关 vue axios 下载文件

功能：点击导出按钮，提交请求，下载excel文件；第一步：跟后端童鞋确认交付的接口的response header设置了 ![response header][] 以及

刺骨的言语ヽ痛彻心扉/ 2021年09月24日 11:34/ 0 赞/ 491 阅读