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

对接后端download接口报未知异常错误

你一定遇到过这种情况,在一个项目中下载功能明明好好的,下载接口调用方法与前端调用方法封装的好好的,可是换了一个接口,竟然搞罢工了,类似下面这样的,你会不会无从下手,不知道该怎么办呢?接下来我们就来说说这个问题。
在这里插入图片描述
一般接口报错主要有两个原因

  1. 后端接口问题
  2. 前端传参问题

首先要搞清楚是不是接口问题,可以在后端给出的接口文档调试页面进行调试,如果正常,那么大概率可以排除接口问题。比如像下面这样调用测试文档后返回了流数据,说明接口是正常的,那大概率是前端的问题了。
在这里插入图片描述
在前端开发中,调用API接口是常见的操作之一。正确地配置请求头(headers)和响应类型(responseType)对于确保请求的成功至关重要。下面详细解释这两个属性的设置及其作用。

Headers 设置

headers 是请求的一部分,它包含了客户端和服务端之间通信所需的信息,比如内容类型、认证信息等。在HTTP请求中,这些头部信息用于告诉服务器关于请求的一些元数据。

  • Content-Type: 这个头部字段用来描述请求体的格式。常见的值有:
    • application/json: 表示请求体是一个JSON对象。
    • application/x-www-form-urlencoded: 表示请求体是一个URL编码过的表单。
    • multipart/form-data: 通常用于上传文件时,因为文件数据不能简单地编码为字符串。

例如,Content-Type 被设置为 application/x-www-form-urlencoded,这意味着如果请求体中有数据的话,应该以URL编码的形式发送。

Response Type 设置

responseType 是一个选项,用于指定期望的响应类型。默认情况下,大多数库如axios会自动解析响应为JSON对象。但是,有时候我们需要直接处理原始的响应数据,这时就需要设置responseType了。

  • arraybuffer: 响应数据会被转换成ArrayBuffer。
  • blob: 响应数据将会是一个Blob对象,适用于处理文件或多媒体数据。
  • document: 当响应内容为HTML或XML文档时使用。
  • json: 自动解析为JSON对象。
  • text: 响应数据将被视为纯文本。

例如,responseType 被设置为 blob,这意味着服务端返回的数据将作为二进制数据处理,而不是尝试解析为JSON。这对于下载文件尤其有用,因为文件通常是以二进制形式传输的。

示例

假设我们使用axios库来发送一个GET请求,并且我们知道响应将是一个文件,我们可以这样设置:

import axios from 'axios';axios.get('/api/download', {headers: {'Content-Type': 'application/x-www-form-urlencoded',},responseType: 'blob'
})
.then(response => {// response.data 是一个 Blob 对象const blob = new Blob([response.data]);// 保存文件到本地saveAs(blob, 'example.pdf');
})
.catch(error => {console.error('Error downloading the file:', error);
});

在这个例子中,我们指定了请求头Content-Typeapplication/x-www-form-urlencoded,并且设置了responseTypeblob,以便正确处理文件下载。

总之,正确配置headersresponseType可以帮助你更好地控制请求和响应的处理方式,确保数据能够按照预期的方式进行交互。

注意,saveAs方法来自 file-saver库的一个方法,主要目的是接收一个Blob对象或ArrayBuffer,并将其保存为本地文件。这对于从Web应用中下载文件特别有用,例如从服务器获取的数据、生成的PDF文件、图像等。

那么报错了,如何解决呢,我的解决方法是将前端调用报错接口与后端调用正常的接口进行比较,看看headers配置是否一致,参数传递是否一致,请求方法是否一致
在这里插入图片描述

我这次报错是因为headersresponseType设置和后端接口不一致造成,修改一致后就OK了!

相关文章:

对接后端download接口报未知异常错误

你一定遇到过这种情况,在一个项目中下载功能明明好好的,下载接口调用方法与前端调用方法封装的好好的,可是换了一个接口,竟然搞罢工了,类似下面这样的,你会不会无从下手,不知道该怎么办呢&#…...

vue3 指定元素全屏 screenfull(可直接粘贴使用)

业务需求 由于输入的文字较多,需要将输入框进行全屏展示,方便输入和查看! 效果图 实现方式 下载插件"screenfull": “^6.0.2” yarn add screenfull -S项目中使用 import screenfull from "screenfull"templte中代码…...

【规范】Git Commit 约定式提交规范

文章目录 前言介绍使用约定式提交规范的好处提交信息格式信息头部(Header)正文(Body)脚注(Footer)撤销(Revert) 提交类型表格官网 前言介绍 约定式提交规范它是一种基于提交信息的轻…...

GDB的基本使用方法(之一)

1.编译程序 如果要让GDB调试程序,则编译生成程序时,要添加-g编译选项: $gcc -Wall -O2 -g 源文件 编译器含有针对源代码中的各种各样的错误输出信息的功能,称为警告选项。这些信息并不一定是错误,但却指出了容易引发bug的编码方式。-Werror选项可以在警告发生时,将其当…...

DoubletFinder去除双细胞分析学习

在单细胞RNA测序过程中,有时两个或多个细胞可能在制备过程中意外结合成一个单一的"假细胞",称为双峰细胞或双倍体。这些双峰细胞可能会扭曲数据分析和解释,因此,需要使用一些方法对它们进行识别和剔除。其中DoubletFind…...

软考高级第四版备考---第四十八天(项目基本要素-项目项目、项目集、项目组合和运营管理之间的关系)

一、概述: 项目集是一组相互关联且被协调管理的项目、子项目集和项目集活动,目的是为了获得分别管理无法获得的利益。项目集不是大项目,大项目是指规模、影响等特别大的项目; 项目组合是指为实现战略目标而组合在一起管理的项目、…...

系统架构设计师:信息系统基础知识

简简单单 Online zuozuo: 简简单单 Online zuozuo 简简单单 Online zuozuo 简简单单 Online zuozuo 简简单单 Online zuozuo :本心、输入输出、结果 简简单单 Online zuozuo : 文章目录 系统架构设计师:信息系统基础知识前言信息系统构成:信息系统功能:信息系统生命周期…...

微服务-nacos

nacos-注册中心 启动 服务注册到nacos...

快速上手 | 数据可观测性平台 Datavines 自定义SQL规则使用指南

摘要 本文主要介绍在 Datavines平台已有规则不能满足需求的情况下,如何通过自定义SQL规则来实现基于业务特性的数据质量检查。 规则介绍 自定义聚合SQL规则是 Datavines 平台中内置的一个灵活的规则,该规则允许用户通过编写SQL的方式来实现想要的数据质…...

MySQL零基础入门教程-6 查询去重、内外连接查询、子查询、分页查询DQL,基础+实战

教程来源:B站视频BV1Vy4y1z7EX 001-数据库概述_哔哩哔哩_bilibili 我听课收集整理的课程的完整笔记,供大家学习交流下载:夸克网盘分享 本文内容为完整笔记的第六篇 分组查询&DQL总结P41-P66 1、把查询结果去除重复记录 注意&#xf…...

Elastic:如何将数据转化为可操作的见解?

作者:来自 Elastic Elastic Platform Team 一切,从某种程度上说,每个人,都是数据。在我们这个数据驱动的世界里,我们的兴趣和互动被统计和分类,为组织提供如何创造更好的产品和更好的体验的见解。更不用说&…...

基于SSM和VUE的药品管理系统(含源码+sql+视频导入教程+文档)

👉文末查看项目功能视频演示获取源码sql脚本视频导入教程视频 1 、功能描述 基于SSM和VUE的药品管理系统2拥有两种角色 管理员:药品管理、出库管理、入库管理、销售员管理、报损管理等 销售员:登录注册、入库、出库、销售、报损等 1.1 背景…...

机器学习--神经网络

神经网络 计算 神经网络非常简单,举个例子就理解了(最后一层的那个写错了,应该是 a 1 ( 3 ) a^{(3)}_1 a1(3)​): n o t a t i o n notation notation: a j ( i ) a^{(i)}_j aj(i)​ 表示第 i i i 层的…...

post请求中有[]报400异常

序言 在和前端同学联调的时候,发现只要post请求参数里面有[],就会报400的错误 可以看到日志中: The valid characters are defined in RFC 7230 and RFC 3986 解决办法: 参考了博客: spring boot 中解决post请求中有…...

ad22 如何在pcb 的keepout layout 上画线 然后裁出想要的黑色画布大小

选择下面的keepout layout,然后右键打开,然后按照这个图进行选择 然后看这个界面我收藏的第三个,就可以了...

SparkSQL SET和RESET

前言 我们在用代码写spark程序的时候,如果要设置一些配置参数,可以通过: SparkConf val conf = new SparkConf().setMaster("local[2]").setAppName("CountingSheep") val sc = new SparkContext(conf)spark-submit ./bin/spark-submit --name "M…...

java 中线程的等待和唤醒

java.lang.Object#wait() java.lang.Object#wait(long) java.lang.Object#wait(long, int) java.lang.Object#notify() java.lang.Object#notifyAll() 这几个方法属于Object,在使用 synchronized 实现同步的时候,需要使用当前监视器的以上方法&#xff…...

windows下自启springboot项目(jar+nginx)

1、将springboot项目打包为jar 2、新建文本文档 test.txt,并输入 java -jar D:\test\test.jar(修改为自己的jar包位置) 保存 然后修将后缀名改为 .bat 3、在同一目录再新建 文本文档test.txt,输入以下内容,&…...

解锁SAP数据的潜力:SNP Glue与SAP Datasphere的协同作用

在各种文章中,我们研究了客户如何利用SNP Glue与基于云的数据仓库和数据湖相结合,以充分利用其SAP数据。SNP Glue 通过高性能集成解决方案帮助客户解锁 SAP 数据孤岛。例如,可以使用SNP Glue先进的增量捕获(CDC)近乎实…...

Missing package to enable rendering OpenAI Gym in Colab

题意:“缺少用于在 Colab 中渲染 OpenAI Gym 的软件包。” 问题背景: Im attempting to render OpenAI Gym environments in Colab via a Mac using the StarAI code referenced in previous questions on this topic. However, it fails. The key erro…...

vscode里如何用git

打开vs终端执行如下: 1 初始化 Git 仓库(如果尚未初始化) git init 2 添加文件到 Git 仓库 git add . 3 使用 git commit 命令来提交你的更改。确保在提交时加上一个有用的消息。 git commit -m "备注信息" 4 …...

模型参数、模型存储精度、参数与显存

模型参数量衡量单位 M:百万(Million) B:十亿(Billion) 1 B 1000 M 1B 1000M 1B1000M 参数存储精度 模型参数是固定的,但是一个参数所表示多少字节不一定,需要看这个参数以什么…...

DockerHub与私有镜像仓库在容器化中的应用与管理

哈喽,大家好,我是左手python! Docker Hub的应用与管理 Docker Hub的基本概念与使用方法 Docker Hub是Docker官方提供的一个公共镜像仓库,用户可以在其中找到各种操作系统、软件和应用的镜像。开发者可以通过Docker Hub轻松获取所…...

中南大学无人机智能体的全面评估!BEDI:用于评估无人机上具身智能体的综合性基准测试

作者:Mingning Guo, Mengwei Wu, Jiarun He, Shaoxian Li, Haifeng Li, Chao Tao单位:中南大学地球科学与信息物理学院论文标题:BEDI: A Comprehensive Benchmark for Evaluating Embodied Agents on UAVs论文链接:https://arxiv.…...

centos 7 部署awstats 网站访问检测

一、基础环境准备(两种安装方式都要做) bash # 安装必要依赖 yum install -y httpd perl mod_perl perl-Time-HiRes perl-DateTime systemctl enable httpd # 设置 Apache 开机自启 systemctl start httpd # 启动 Apache二、安装 AWStats&#xff0…...

理解 MCP 工作流:使用 Ollama 和 LangChain 构建本地 MCP 客户端

🌟 什么是 MCP? 模型控制协议 (MCP) 是一种创新的协议,旨在无缝连接 AI 模型与应用程序。 MCP 是一个开源协议,它标准化了我们的 LLM 应用程序连接所需工具和数据源并与之协作的方式。 可以把它想象成你的 AI 模型 和想要使用它…...

STM32F4基本定时器使用和原理详解

STM32F4基本定时器使用和原理详解 前言如何确定定时器挂载在哪条时钟线上配置及使用方法参数配置PrescalerCounter ModeCounter Periodauto-reload preloadTrigger Event Selection 中断配置生成的代码及使用方法初始化代码基本定时器触发DCA或者ADC的代码讲解中断代码定时启动…...

测试markdown--肇兴

day1: 1、去程:7:04 --11:32高铁 高铁右转上售票大厅2楼,穿过候车厅下一楼,上大巴车 ¥10/人 **2、到达:**12点多到达寨子,买门票,美团/抖音:¥78人 3、中饭&a…...

Java - Mysql数据类型对应

Mysql数据类型java数据类型备注整型INT/INTEGERint / java.lang.Integer–BIGINTlong/java.lang.Long–––浮点型FLOATfloat/java.lang.FloatDOUBLEdouble/java.lang.Double–DECIMAL/NUMERICjava.math.BigDecimal字符串型CHARjava.lang.String固定长度字符串VARCHARjava.lang…...

(二)原型模式

原型的功能是将一个已经存在的对象作为源目标,其余对象都是通过这个源目标创建。发挥复制的作用就是原型模式的核心思想。 一、源型模式的定义 原型模式是指第二次创建对象可以通过复制已经存在的原型对象来实现,忽略对象创建过程中的其它细节。 📌 核心特点: 避免重复初…...