当前位置: 首页 > article >正文

前端实现将二进制文件流,并下载为excel文件

前端实现将二进制文件流,并下载为excel文件-腾讯云开发者社区-腾讯云

1、导入excel方法代码片段

// 导入时,接口调用,失败后得到文件流
axios(url, {
	method: 'post',
	responseType: 'blob',
	url: '/api/import',
  	data: formData, // 导入文件一般都用FormData 格式数据
}).then(res => {
  if(res.code === 200) {
    // 导入成功
  } else {
    // 导入失败,需要将返回的文件流res.data进行转换
    this.downloadBinaryFile(res.data, '导入失败后下载的报错文件')
  }
})

2、二进制文件流转换成excel方法实现

/**
 * 将二进制文件下载到本地,保存为excel文件
 * @param {*} binFile 二进制文件流
 * @param {*} fileName 下载后的文件名
 * @param {*} blobType 文件格式
 */
downloadBinaryFile(binFile, fileName, blobType="application/vnd.ms-excel") {
	const blobObj = new Blob([binFile], { type: blobType });
	const downloadLink = document.createElement('a');
	let url = window.URL || window.webkitURL || window.moxURL; // 浏览器兼容
	url = url.createObjectURL(blobObj);
	downloadLink.href = url;
	downloadLink.download = fileName;
	document.body.appendChild(downloadLink);
	downloadLink.click();
	document.body.removeChild(downloadLink);
	window.URL.revokeObjectURL(url);
}

vue进行下载与处理二进制流文件的方法详解_vue.js_脚本之家

Axios发送请求下载文件(重写二进制流文件) - 艺术诗人 - 博客园

解决axios传递数组参数问题 axios传递多个参数_jowvid的技术博客_51CTO博客 

axios 下载文件且携带参数(Excel、Word...)_axios下载请求参数-CSDN博客 

        axios.get('/download-endpoint', {
          params: {
            arrayParam: ['item1', 'item2', 'item3'], // 数组参数
            anotherParam: 'value' // 其他非数组参数
          },
          responseType: 'blob' // 指定响应类型为blob以正确处理文件下载
        })

http://www.kler.cn/news/319227.html

相关文章:

  • HarmonyOS鸿蒙开发实战(5.0)自定义全局弹窗实践
  • 缓存技术的核心价值与应用
  • android studio 批量修改包名 app package name
  • 技术周总结 09.16~09.22 周日(架构 C# 数据库)
  • 基于Java,SpringBoot和Vue的仓库管理商品管理电商后台管理系统
  • 交换机和路由器的区别
  • HTML-DOM模型
  • 《深度学习》—— 神经网络中的调整学习率
  • React组件如何暴露自身的方法
  • 专题·大模型安全 | 生成式人工智能的内容安全风险与应对策略
  • 由一个 SwiftData “诡异”运行时崩溃而引发的钩深索隐(六)
  • NLP(二)-文本表示
  • JavaScript 构造函数、原型和原型链
  • 芝士派(百宝箱):阿里系智能体平台降临啦
  • python编程开发“人机猜拳”游戏
  • 财务报表中科目的指标值范围
  • web学习——day1
  • Python精选200Tips:166-170
  • Redis中String命令的基础操作
  • 简单工厂模式
  • SQL常用语法详解
  • SelMatch:最新数据集蒸馏,仅用5%训练数据也是可以的 | ICML‘24
  • 【深度学习】聊一聊正则化
  • C++之 string(中)
  • 1.1 elasticsearch分布式集群基本搭建(centos7.x + elaticsearch7.11.1)
  • 【代码随想录训练营第42期 Day60打卡 - 图论Part10 - Bellman_ford算法系列运用
  • 什么是集成学习?
  • 如何使用ssm实现基于VUE.js的在线教育系统+vue
  • Go调试工具—— Delve
  • 2024 ICPC ShaanXi Provincial Contest —— C. Seats(个人理解)拓扑+dfs