前端下载文件问题之如何获取报错信息

问题:点击下载后。接口会生成并返回文件流。在极端情况下接口数据返回异常,需要抛出错误信息,比如后端拼接错误情况、空文件情况。
难点:responseType设置为Blob后,返回内容为二进制文件流,从而无法获取错误信息。文件流截图如下:
在这里插入图片描述
解决方法:FileReafer()方案解决,示例代码:

if(res.data.success===undefined && res.data.type === 'application/json'){const fileReader = new FileReader()fileReader.readAsText(res.data,'utf-8')fileReader.onload = function(){const result = JSON.parse(fileReader.result)// 获取到接口json对象。// 	情况1:有返回msg和code码(通过和业务层协商获取),可根据result.code码,弹出result.msg提示语// 情况2: 返回正常,data为null,表明为空文件,弹窗提示为空文件取消下载。}return}

总结:
1.下载文件场景ResponseType:"blob"时,需要报错提示,通过new FileReader把返回的数据转成文件,从而读取错误信息;

2.文件下载的方法,组装成二进制流文件,通过content-disposition获取正确的中文件名。代码如下:

if (res.headers["content-disposition"]) {const fileName = decodeURIComponent(res.headers["content-disposition"].split("=")[1]);byteToFile(res.data, fileName);return true}

3.byteToFile,返回的文件流数据转化为路径,创建A标签,触发点击下载文件路径。

export const byteToFile = (data, fileName) => {let blob = new Blob([data]); let url = window.URL.createObjectURL(blob); let aLink = document.createElement("a");if (fileName) {aLink.download = fileName;}aLink.href = url;aLink.click();
}

;

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

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

相关文章

Nginx学习之Nginx高性能的实现原理

Nginx学习之Nginx高性能的实现原理   Nginx 采用的是多进程(单线程) & 多路IO复用模型,使用了 I/O 多路复用技术的 Nginx,就成了”并发事件驱动“的服务器,同时使用sendfile等技术,最终实现了高性能。…

简单最短路径算法

前言 图的最短路径算法主要包括: 有向无权图的单源最短路径 宽度优先搜索算法(bfs) 有向非负权图的单源最短路径 迪杰斯特拉算法(Dijkstra) 有向有权图的单源最短路径 贝尔曼福特算法(Bellman-Ford&#…

全志R128 SDK架构与目录结构

R128 S2 是全志提供的一款 M33(ARM)C906(RISCV-64)HIFI5(Xtensa) 三核异构 SoC,同时芯片内部 SIP 有 1M SRAM、8M LSPSRAM、8M HSPSRAM 以及 16M NORFLASH。本文档作为 R128 FreeRTOS SDK 开发指南,旨在帮助软件开发工程师、技术支持工程师快速上手&…

Kodi 开源多媒体播放器

Kodi (原名 XBMC) 是一款经典开源免费、跨平台且极其强大专业的多媒体影音播放器,包含专业的影音内容管理以及解码播放功能于一体,提供适合在手机/电视/投影/大屏幕上显示的全屏界面,无线手机遥控操作方式,以及功能相当丰富的插件…

Selenium-java元素等待三种方式

第二种方式需要写在创建driver时的代码下面 第三种则是对每个定位元素进行配置

Mybatis之多表查询

目录 一、简介 1、使用嵌套查询: 2、使用多个 SQL 语句: 3、使用关联查询: 4、使用自定义映射查询: 二、业务场景 三、示例 1、一对一查询 2、一对多查询 一、简介 MyBatis 是一个优秀的持久层框架,它提供了强大的支持来执…

/bin/bash: cannot execute binary file

容器内部无法执行二进制文件 原因是docker镜像的 入口点不能指向/bin/bash。移除ENTRYPOINT ["/bin/bash"]就足以使其正常工作。 如果是下载的镜像,不能修改ENTRYPOIN,可以使用dockerfile覆盖掉原来的ENTRYPOINT FROM ubuntu ENTRYPOINT [ …

常见的软件架构风格

我的新书《Android App开发入门与实战》已于2020年8月由人民邮电出版社出版,欢迎购买。点击进入详情 以下是最常见的建筑风格: 整体式:将整个应用程序构建为一个单元,其中所有功能和组件都从一个位置进行管理和服务。整体架构的例…

使用“反向代理服务器”的优点是什么?

反向代理服务器是一种网络架构模式,通常位于客户端和实际服务器之间,用于处理客户端请求并转发到实际服务器。以下是使用反向代理服务器的优点: 1.安全性:反向代理服务器可以提供额外的安全层。通过在反向代理服务器上配置防火墙和…

Prometheus-blackbox

一. 部署 apiVersion: v1 kind: ConfigMap metadata:name: blackbox-confignamespace: monitor data:blackbox.yml: |-modules:http_2xx: # http 检测模块 Blockbox-Exporter 中所有的探针均是以 Module 的信息进行配置prober: httptimeout: 10shttp:valid_http_versions: […

Android中的Intent

一.显式Intent 显示Intent是明确目标Activity的类名 1. 通过Intent(Context packageContext, Class<?> cls)构造方法 2.通过Intent的setComponent()方法 3.通过Intent的setClass/setClassName方法 通过Intent(Context packageContext, Class<?> cls)构造方法 通…

羊大师解读,羊奶的口味更适合哪些人群?

羊大师解读&#xff0c;羊奶的口味更适合哪些人群&#xff1f; 羊奶作为一种营养丰富的乳制品&#xff0c;拥有许多独特的品质和口味&#xff0c;备受消费者的青睐。它不仅含有丰富的蛋白质、维生素和矿物质&#xff0c;还具有更易消化的特点&#xff0c;适合许多人群的饮用。…

【KingbaseES】实现MySql函数WEEKS_BETWEEN

WEEKS_BETWEEN CREATE OR REPLACE FUNCTION weeks_between(start_date date, end_date date) RETURNS integer AS $$ BEGIN RETURN EXTRACT(WEEK FROM end_date) - EXTRACT(WEEK FROM start_date); END; $$ LANGUAGE plpgsql IMMUTABLE;结果展示

【C语言】stdbool.h——有关bool的总结

在编程和日常生活中&#xff0c;经常需要一种只能具有两个值之一的数据类型&#xff0c;如是否、开关、真假等&#xff0c;因此&#xff0c;C 有一种bool数据类型&#xff0c;称为booleans。布尔值表示 或true的值false。 C 中的 bool 是大多数语言中的基本数据类型&#xff0…

图片上传下载

数据模型: imageUrl: , <el-form-item label"楼盘图片:" prop"pic" class"uploadImg" v-model"emp.pic"> <el-upload class"avatar-uploader" …

自制java工具实现 ctrl+c+c 翻译鼠标选中文本

前言 本功能的实现基于这篇笔记 http://t.csdnimg.cn/1I8ln&#xff0c;本文阅读过程中有疑惑都可以查看此笔记 实现思路&#xff1a;检测到按压ctrl c c 后&#xff0c;获取当前剪切板文字&#xff0c;调用百度翻译api。 实现结果&#xff1a; 完整代码在最后 实现过程 1 监控…

Java中请求生成唯一追溯TraceId

Java中请求生成唯一追溯TraceId 一&#xff1a;背景 因为是微服务架构,平常日志太多,看日志不太好查,所以想要从一整个链路当中获取一个唯一标识,比较好定位问题&#xff0c; 原理就是从gateway网关将标识传递到下游,下游服务拿到这个标识,响应结束后将traceId反向写入响应体…

[论文笔记] Megtron_LM 0、报错:vscode调试无法传进去参数 launch.json文件获取args参数

解决方法&#xff1a; 配置好launch.json文件后&#xff0c;应该点运行和调试里面的运行按钮。而不是直接点文件右上角的debug。 可以看到terminal中&#xff0c;如果没有正常加载launch.json&#xff0c;则参数中没有args的参数。 如果正常加载&#xff0c;可以看到args的很多…

Java中的IO与NIO篇----第四篇

系列文章目录 文章目录 系列文章目录前言一、NIO 的非阻塞二、Channel三、Buffer四、Selector前言 前些天发现了一个巨牛的人工智能学习网站,通俗易懂,风趣幽默,忍不住分享一下给大家。点击跳转到网站,这篇文章男女通用,看懂了就去分享给你的码吧。 一、NIO 的非阻塞 I…

C++ OpenGL 3D GameTutorial 1:Making the window with win32 API学习笔记

视频地址https://www.youtube.com/watch?vjHcz22MDPeE&listPLv8DnRaQOs5-MR-zbP1QUdq5FL0FWqVzg 一、入口函数 首先看入口函数main代码&#xff1a; #include<OGL3D/Game/OGame.h>int main() {OGame game;game.Run();return 0; } 这里交代个关于C语法的问题&#x…