reac 后端接口返回二进制文件流前端导出文件

axios配置

复制代码
在你的请求中加入
responseType:'blob'

导出函数

复制代码
export interface DownloadFileOptions {
    filename: string; //文件名称
    
  }
  
  /**
   * 下载二进制文件流
   * @param data - 二进制数据
   * @param options - 下载配置
   */
  export const downloadBinaryFile1 = (
    data: any,  // 这里使用 any 是因为后端返回的数据类型可能不一致
    options: DownloadFileOptions
  ): void => {
    const sset=new Blob([data])
    const url = window.URL.createObjectURL(sset);
    const filename=options.filename
      const link = document.createElement('a');
      link.href = url;
      link.download = filename;
      
      // 触发下载
      document.body.appendChild(link);
      link.click();
      // 清理并移除元素和创建的URL
      document.body.removeChild(link);
      URL.revokeObjectURL(url);
  };
相关推荐
爱勇宝7 小时前
大多数人不是在使用 AI 赚钱,而是在帮 AI 公司赚钱
前端·后端·程序员
冬奇Lab7 小时前
每日一个开源项目(第143篇):page-agent - 纯 JS 的网页 GUI Agent,无需截图、无需插件、无需后端
前端·人工智能·agent
IT_陈寒12 小时前
React的这个渲染问题连官方文档都没说清楚
前端·人工智能·后端
追逐时光者13 小时前
别再满网找零散工具了,腾讯 QQ 浏览器这个“帮小忙”工具箱真能省时间
前端·后端
Asmewill15 小时前
grep&curl命令学习笔记
前端
stringwu15 小时前
Flutter 开发必备:MVI 架构的高效实现指南
前端·flutter
用户21366100357216 小时前
Vue2组件化开发与父子通信
前端·vue.js
Momo__17 小时前
TypeScript satisfies 操作符——比 as 更安全的类型守门员
前端·typescript
用户21366100357217 小时前
Vue2事件系统与指令进阶
前端·vue.js
labixiong17 小时前
实现一个能跑的迷你版Promise(一)
前端·javascript·面试