前端导出下载文件后提示无法打开文件

问题

项目中的导出文件功能,导出下载后的文件打开提示如下:

请添加图片描述

原因

对返回的响应数据进行打印,发现响应数据为字符串格式,前期规划的后端返回数据应该 blob 对象的。后经排查后发现是请求头缺少了响应数据格式的配置,应该在请求头加上 responseType 属性配置后端返回的数据格式才正确(这里根据自身需求来进行配置,作者项目中需要得到 blob 对象所以配置为 responseType: ‘blob’)。

作者这里是对 axios 请求进行了封装,代码如下:

export function TrackExport(data: any) {return axios({url: '/...',method: 'POST',data,headers: {'Content-Type': 'application/json; application/octet-stream'},responseType: 'blob' //响应数据格式配置})
}

返回响应数据:

请添加图片描述
添加之后,相应返回来的数据格式就正确了。

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

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

相关文章

#FPGA(IRDA)

1.IDE:Quartus II 2.设备:Cyclone II EP2C8Q208C8N 3.实验:IRDA(仿真接收一个来自0x57地址的数据0x22 (十进制34)) 4.时序图: 5.步骤 6.代码: irda_receive.v module irda_receive ( input wire…

从故宫修建看「软件物料清单」的重要性 @安全历史01

故宫,这座中国传统文化的重要代表和象征性建筑已屹立近600年,是世界上现存规模最大、保存最为完整的木质结构古建筑之一。 故宫之所以能至今保存完好,除持续保护和修缮外,其使用的木材和砖石等材料也经过了精挑细选,保…

IOBR2 更新(学习自备)

IOBR查看其收录的相关基因集(自备)_肿瘤 tme特征 iobr-CSDN博客 IOBR2:多维度解析肿瘤微环境 - 知乎 (zhihu.com) 学习手册:https://iobr.github.io/book/ (里面有详细教程) 系统综合的分析工具(Immuno-Oncology Bi…

渗透工具——kali中wpscan简介

一、什么是wpscan 1、常用于做用户名枚举爆破 2、WPScan是一个扫描 WordPress 漏洞的黑盒子扫描器,它可以为所有 Web 开发人员扫描 WordPress 漏洞并在他们开发前找到并解决问题。我们还使用了 Nikto ,它是一款非常棒的Web 服务器评估工具,…

深入浅出JVM(九)之字节码指令(上篇)

本篇文章主要围绕字节码的指令,深入浅出的解析各种类型字节码指令,如:加载存储、算术、类型转换、对象创建与访问、方法调用与返回、控制转义、异常处理、同步等 由于字节码指令种类太多,本文作为上篇概述加载存储、算术、类型转…

IT廉连看——C语言——操作符

IT廉连看—操作符 c语言中有许多操作符,可以用于对变量进行各种不同的操作 一、算术操作符 - * / % 除了 % 操作符之外,其他的几个操作符可以作用于整数和浮点数。 对于 / 操作符如果两个操作数都为整数,执行整数除法。而只要有浮点…

vue+nodejs+uniapp婚纱定制婚庆摄影系统 微信小程序 springboot+python

目前移动互联网大行其道,人人都手中拿着智能机,手机手机,手不离机,如果开发一个用在手机上的程序软件,那是多么的符合潮流,符合管理者和客户的理想。本次就是开发婚庆摄影小程序,有管理员&#…

基础光学系列:(三)揭秘机器视觉中的光圈、焦距与景深的作用

​今天来聊聊成像原理、光圈、焦距和景深,这些概念在摄影、摄像以及机器视觉领域都非常重要。它们共同影响着成像设备捕捉图像的质量和特性。让我们一一解析这些概念以及它们如何在机器视觉行业中应用。 成像原理:怎样把外面的世界捕捉进来 想象一下&a…

大厂面试-美团高频考察算法之重排链表

本文学习目标或巩固的知识点 学习如何处理链表重排类题目 巩固反转链表巩固快慢指针巩固合并链表 提前说明:算法题目来自力扣、牛客等等途径 🟢表示简单 🟡表示中等 🔴表示困难 🤮表示恶心 博主真实经历,…

前后端分离Vue+ElementUI+nodejs蛋糕甜品商城购物网站95m4l

本文主要介绍了一种基于windows平台实现的蛋糕购物商城网站。该系统为用户找到蛋糕购物商城网站提供了更安全、更高效、更便捷的途径。本系统有二个角色:管理员和用户,要求具备以下功能: (1)用户可以修改个人信息&…

LabVIEW储氢材料循环寿命测试系统

LabVIEW储氢材料循环寿命测试系统 随着氢能技术的发展,固态储氢技术因其高密度和安全性成为研究热点。储氢材料的循环寿命是衡量其工程应用的关键。然而,传统的循环寿命测试设备存在成本高、测试效率低、数据处理复杂等问题。设计了一种基于LabVIEW软件…

uniapp 使用 z-paging组件

使用 z-paging 导入插件 获取插件进行导入 自定义上拉加载样式和下拉加载样式 页面结构 例子 搭建页面 <template><view class"content"><z-paging ref"paging" v-model"dataList" query"queryList"><templ…

【VSCode】SSH Remote 通过跳板机连开发机提示“bash行1 powershell未找到命令”

需求背景 因为需要&#xff0c;在家我需要挂上公司VPN然后SSH连到跳板机&#xff0c;然后再从跳板机SSH进开发机。 问题背景 跳板机进开发机输入完密码显示 bash行1 powershell未找到命令VSCode SSH Remote跳板机配置请自行搜素其他文章config配置 注意其中ssh.exe地址请根据…

并发编程(5)共享模型之不可变

7 共享模型之不可变 本章内容 不可变类的使用不可变类设计无状态类设计 7.1 日期转换的问题 问题提出 下面的代码在运行时&#xff0c;由于 SimpleDateFormat 不是线程安全的, 有很大几率出现 java.lang.NumberFormatException 或者出现不正确的日期解析结果&#xff0c;…

规则持久化(Sentinel)

规则持久化 基于Nacos配置中心实现推送 引入依赖 <dependency><groupId>com.alibaba.csp</groupId><artifactId>sentinel-datasource-nacos</artifactId> </dependency> 流控配置文件 [{"resource":"/order/flow",…

六、Vuex

六、Vuex 6.1 Vuex是什么 概念&#xff1a;专门在 Vue 中实现集中式状态&#xff08;数据&#xff09;管理的一个 Vue 插件&#xff0c;对 vue 应 用中多个组件的共享状态进行集中式的管理&#xff08;读/写&#xff09;&#xff0c;也是一种组件间通信的方 式&#xff0c;且…

vue3获取环境变量import.meta.env

vitevue的时候环境变量的获取方式变成如下&#xff1a; console.log(import.meta.env)

ARMv8-AArch64 的异常处理模型详解之异常向量表vector tables

目录 一&#xff0c;AArch64 异常向量表 二&#xff0c;栈指针以及SP寄存器的选择 三&#xff0c;从异常返回 一&#xff0c;AArch64 异常向量表 异常向量表&#xff08;vector tables&#xff09;是一组存放于普通内存&#xff08;normal memory&#xff09;空间的&#xf…

【机器学习科学库】全md文档笔记:Jupyter Notebook和Matplotlib使用(已分享,附代码)

本系列文章md笔记&#xff08;已分享&#xff09;主要讨论人工智能相关知识。主要内容包括&#xff0c;了解机器学习定义以及应用场景&#xff0c;掌握机器学习基础环境的安装和使用&#xff0c;掌握利用常用的科学计算库对数据进行展示、分析&#xff0c;学会使用jupyter note…

vue从flask获取数据并显示

记录一个前后端分离遇到的问题&#xff0c;即vue前端从flask后端获取数据。具体描述如下&#xff1a;flask只负责连接数据库并获取数据库的数据&#xff0c;并返回给前端vue&#xff1b;vue则需要获取后端返回的数据并显示。 方法如下&#xff0c;分别用一个vue组件和一个flas…