js 将二进制文件流,下载为excel文件

news2024/9/22 2:59:13

吃西瓜

现成的粒子

二进制流,是一种计算机文件格式,它的数据以二进制形式存储,与文本文件不同,

二进制文件可以包含任意类型的数据,例如:图像、音频、视频、可执行文件、压缩文件等,而文本文件则仅仅包含 ASCII 码或其他编码的字符数据。

  • 常见的: ‘Blob、ArrayBuffer、File、FileReader 和 FormData’
  • 在浏览器中长这样:
    在这里插入图片描述



blobType 指的是,服务端返回的 Content-Typemine-type
常用的excel类型一般有2种:application/vnd.ms-excelapplication/vnd.openxmlformats-officedocument.spreadsheetml.sheet

如:
在这里插入图片描述


export const filmOrderExcelOut = (parameter: Record<any, any>) => {
	return request({
		method: 'post',
		url: Api.filmOrderExcelOut,
		data: parameter,
		responseType: 'blob'   `【一定得加这个】`
	})
}

--------------------------------------------------------------------

// 导出表格
const exportExcel = async () => {
	try {
		let { data } = await orderApi.filmOrderExcelOut(searchParams.value)
		
		let blob = new Blob([data], { type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet' })
		
		let file = new File([blob], '订单.xlsx', {
			lastModified: new Date() as any,
			type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet'
		})
		// console.log('file=', file)
		
		const a = document.createElement('a')
		a.style.display = 'none'
		document.body.appendChild(a)
		const url = URL.createObjectURL(file)
		a.href = url
		a.download = file.name
		a.click()
		// 清理
		document.body.removeChild(a)
		URL.revokeObjectURL(url)
	} catch (error) {
		message.error('网络请求发送失败~')
	}
}

出错的地方

  • 问题:成功将文件流转换成了excel文件,并下载了,但是下载后的文件打不了!!!
  • 原因:就是因为请求接口时,少了这个 responseType: 'blob' 配置项
export const filmOrderExcelOut = (parameter: Record<any, any>) => {
	return request({
		method: 'post',
		url: Api.filmOrderExcelOut,
		data: parameter,
		responseType: 'blob'   `【一定得加这个】`
	})
}

`responseType`:表示,服务器响应的数据类型,可以是 'arraybuffer''blob''document''json''text''stream'
  • arraybuffer:设置响应类型为二进制对象【返回的是一个包含二进制数据的 JavaScript ArrayBuffer 类型化数组】
  • blob:设置响应类型为二进制对象【返回的是一个包含二进制数据的 Blob 对象】
  • document: 设置响应类型为html document 或 xml document,具体根据接收到的数据的 MIME 类型而定
  • json: 设置响应类型为json类型,日常开发中常用
  • text:设置响应类型为text文本类型

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/2153957.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

基于协同过滤+python+django+vue的音乐推荐系统

作者&#xff1a;计算机学姐 开发技术&#xff1a;SpringBoot、SSM、Vue、MySQL、JSP、ElementUI、Python、小程序等&#xff0c;“文末源码”。 专栏推荐&#xff1a;前后端分离项目源码、SpringBoot项目源码、SSM项目源码 系统展示 【2025最新】基于协同过滤pythondjangovue…

linux cat命令的实现

cat 是 Linux 和其他 Unix-like 系统中的一个常用命令&#xff0c;它的名称来源于 "concatenate"&#xff08;连接&#xff09;的缩写。cat 命令主要用于查看、创建和拼接文件。它读取一个或多个文件的内容&#xff0c;并将它们显示在标准输出&#xff08;通常是终端…

DELPHI编译软件时带上当前IDE的版本号

如果通过 CompilerVersion 得到的也只是编译器的版本号。 比如&#xff1a;delphi XE12 是 36 &#xff0c;也仅此而己。 我想得到的是IDE的版本号&#xff0c;比如当前最新版本的DELPHI是&#xff1a;Embarcadero RAD Studio 12 Version 29.0.53571.9782 我想得到 29.0.53…

实验:WLAN无线综合实验

无线综合实验的概述&#xff1a; WLAN无线综合实验是一种针对无线网络技术的综合性实验&#xff0c;旨在通过实践操作加深对无线局域网&#xff08;WLAN&#xff09;技术的理解和应用能力。以下是对该实验的详细概述&#xff1a; 实验目的 掌握认证AP上线的配置方法&#xff…

VisionPro - 基础 - 00 模板匹配技术和在VP中的使用 - PMAlign - PatMax - (4)- 控制模板的匹配

前言&#xff1a; 针对PatMax 的高级应用和原理&#xff0c;在这一节继续进行说明&#xff1a;这一节主要考虑的是PatMax模板匹配的原理&#xff1a;如何控制模板的匹配。 本节先介绍了几个模板匹配的衡量标准&#xff0c;比如模板匹配分数&#xff0c;和模板的几种模板匹配的…

计算机毕业设计 基于Python的美术馆预约系统的设计与实现 Python+Django+Vue 前后端分离 附源码 讲解 文档

&#x1f34a;作者&#xff1a;计算机编程-吉哥 &#x1f34a;简介&#xff1a;专业从事JavaWeb程序开发&#xff0c;微信小程序开发&#xff0c;定制化项目、 源码、代码讲解、文档撰写、ppt制作。做自己喜欢的事&#xff0c;生活就是快乐的。 &#x1f34a;心愿&#xff1a;点…

pytorch实现RNN网络

目录 1.导包 2. 加载本地文本数据 3.构建循环神经网络层 4.初始化隐藏状态state 5.创建随机的数据&#xff0c;检测一下代码是否能正常运行 6. 构建一个完整的循环神经网络 7.模型训练 8.个人知识点理解 1.导包 import torch from torch import nn from torch.nn imp…

如何解决DataGrip的 Public Key Retrieval is not allowed错误

对于 DataGrip 出现 [08001] Public Key Retrieval is not allowed 错误&#xff0c;原因通常是 MySQL 的安全机制不允许客户端检索公钥。你可以通过以下步骤来解决这个问题&#xff1a; 解决步骤&#xff1a; 修改 DataGrip 中的连接设置&#xff1a; 打开 DataGrip。在左侧导…

CLion/Git版本控制

文章目录 文章介绍准备工具操作首次提交修改代码提交第二版 文章介绍 记录用clion和git做代码的版本控制 准备工具 CLion2024.2.0.1 git 操作 首次提交 该文件夹的打开方式选择clion 全部提交 成功提交后查看分支 修改代码提交第二版

hutool 解压缩读取源文件和压缩文件大小失败导致报错

前言 最近处理老项目中的问题&#xff0c;升级安全jar&#xff0c;发现hutool的jar在解压缩的时候报错了&#xff0c;实际上是很简单的防御zip炸弹攻击的手段&#xff0c;但是却因为hutool的工具包取文件大小有bug&#xff0c;造成了解压缩不能用&#xff0c;报错&#xff1a;…

山东潍坊戴尔存储服务器维修 md3800f raid恢复

山东戴尔存储故障维修 存储型号&#xff1a;DELL PowerVault md3800f 故障问题&#xff1a;存储除尘后通电开机&#xff0c;发现有物理硬盘没有插到位&#xff0c;用户带电拔插了多块物理盘&#xff0c;导致关连的磁盘阵列掉线&#xff0c;卷失败&#xff1b; 处理方式&#xf…

Python基于Django、大数据的北极星招聘数据可视化系统

博主介绍&#xff1a;✌程序员徐师兄、7年大厂程序员经历。全网粉丝12w、csdn博客专家、掘金/华为云/阿里云/InfoQ等平台优质作者、专注于Java技术领域和毕业项目实战✌ &#x1f345;文末获取源码联系&#x1f345; &#x1f447;&#x1f3fb; 精彩专栏推荐订阅&#x1f447;…

[JavaEE] TCP协议

目录 一、TCP协议段格式 二、TCP确保传输可靠的机制 2.1 确认应答 2.2 超时重传 2.3 连接管理 2.3.1 三次握手 2.3.2 四次挥手 2.4 滑动窗口 2.4.1 基础知识 2.4.2 两种丢包情况 2.4.2.1 数据报已经抵达&#xff0c;ACK丢包 2.4.2.2 数据包丢包 2.5 流量控制…

国标GB28181视频融合监控汇聚平台的方案实现及场景应用

Liveweb国标视频融合云平台基于端-边-云一体化架构&#xff0c;部署轻量简单、功能灵活多样&#xff0c;平台可支持多协议&#xff08;GB28181/RTSP/Onvif/海康SDK/Ehome/大华SDK/RTMP推流等&#xff09;、多类型设备接入(IPC/NVR/监控平台)&#xff0c;在视频能力上&#xff0…

图解 | 消息认证码(MAC)到底解决了什么问题?还有什么问题是它解决不了的?

消息认证码&#xff08;Message Authentication Code&#xff0c;MAC&#xff09;是一种用于验证数据完整性和来源可信性&#xff08;对消息进行认证&#xff09;的技术。它通常由一个密钥和被保护的消息通过特定算法计算得出&#xff0c;接收方可以使用相同的密钥&#xff08;…

C++类之set与get理解

在类中&#xff0c;我们尝尝将一些变量设置为private或者protect里面&#xff0c;而我们经常会遇到在主函数&#xff08;main.cpp&#xff09;使用到这些private变量&#xff0c;而往往我们会下意识地在主函数直接调用在private里面的变量&#xff0c;但现实比较残酷&#xff0…

20240921解决使用PotPlayer在WIN10电脑播放4K分辨率10bit的视频出现偏色的问题

20240921解决使用PotPlayer在WIN10电脑播放4K分辨率10bit的视频出现偏色的问题 2024/9/21 10:40 缘起&#xff1a;常见的问题&#xff0c;你下载视频的时候&#xff0c;4K分辨率的视频播放的时候出现偏色异常&#xff0c;但是1080p分辨率的正常呀&#xff01; 偏色的识别&…

re题(32)BUUCTF-[MRCTF2020]hello_world_go

BUUCTF在线评测 (buuoj.cn) 查壳&#xff0c;无壳&#xff0c;64位elf文件 ida打开是go语言写的&#xff0c;shiftF12看字符串 ctrlF搜索字符串&#xff0c;得到flag 本题是go语言写的&#xff0c;可以用linux打开go语言文件&#xff0c;本题直接把flag放到了字符串表&#xf…

数据结构---二叉搜索树(二叉排序树)

什么是二叉排序树 二叉搜索树又是二叉排序树&#xff0c;当我们的是一颗空树或者具有以下性质时&#xff1a; 左子树不为空&#xff0c;左子树上的值都小于我们的根节点上的值。右子树不为空时&#xff0c;右子树上的值都大于我们的根节点上的值左右子树都是二叉搜索树&#…

我的AI工具箱Tauri版-VideoDuplication视频素材去重

本教程基于自研的AI工具箱Tauri版进行VideoDuplication视频素材去重。 该项目是基于自研的AI工具箱Tauri版的视频素材去重工具&#xff0c;用于高效地处理和去除重复视频内容。用户可以通过搜索关键词"去重"或通过路径导航到"Python音频技术/视频tools"模…