响应拦截器的 return Promise.reject(res.data.message)

今天在看老师讲解代码的时候,解决了我心中的一些疑惑。

在做excel文件导出的时候,没有告诉浏览器文件的格式是Blod产生了报错。

看下图:

可以看到下面的内容:如果业务成功 返回 res.data  如果业务失败,给出错误信息的提示,将这个错误抛出去。

因此我们在发送一个请求的时候,通常我们没有使用 try  catch来捕获错误,注意这个时候,如果业务失败,返回错误信息,没有用catch来捕获,会把这个错误抛给浏览器,这个时候浏览器会报红。

如果使用了.catch则浏览器不会有红色。

下面:我们来做一个测试:

APP.vue文件:

  <template><div class=""><button @click="fn">点击发送请求</button></div></template><script>import axios from "../request";export default {data() {return {};},methods: {fn() {axios({methods: "pa",url: "https://www.fastmock.site/mock/f9834bca1c0604895ec164037a0590c6/api/api",}).then((res) => {console.log(res);}).catch(err=>{console.log(err);})},},components: {},};</script><style scoped lang="less"></style>

封装的拦截器代码  request.js:

// 1.导入axios
import axios from "axios";// 3.请求拦截器
axios.interceptors.request.use((config) => {return config;},(error) => {return Promise.reject(error);}
);
// 4.响应拦截器
axios.interceptors.response.use((res) => {if (res.data.a) {return res.data.a}else{return Promise.reject('业务错误')}},() => {return Promise.reject('业务错误');}
);
// 5.暴露出去
export default axios;

我们用mockfast模拟的接口,通常我们在写业务的时候,状态码为200代表成功,不是200代表业务失败这个时候会报错,我们可以看到:

返回成功的Promise对象我们可以then进行接收。

如果状态码不是200则代表业务的失败这个时候肯定是一个错误的 Promise对象,这个时候如果我们没有进行处理就出现报错。这也就是

return Promise.reject('业务错误')

这行代码的意义,我们在调用接口的时候,也无法保证接口的每次调用都是成功的,我们可以用try catch 这个两个方法来对接口进行一个处理,在catch中我们可以捕获错误,告诉浏览器我知道了,这个时候浏览器里面的报红就会消失。

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

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

相关文章

基于springboot+vue的网上租赁系统(前后端分离)

博主主页&#xff1a;猫头鹰源码 博主简介&#xff1a;Java领域优质创作者、CSDN博客专家、公司架构师、全网粉丝5万、专注Java技术领域和毕业设计项目实战 主要内容&#xff1a;毕业设计(Javaweb项目|小程序等)、简历模板、学习资料、面试题库、技术咨询 文末联系获取 研究背景…

鸿蒙开发案列一

1、开发需求 案例app一打开是“Hello world” 界面&#xff0c;开发者点击“Hello world”变成“Hello ArkUI”’ 2、源代码 Entry Component struct Hello {State person_name: string Worldbuild() {Row() {Column() {Text(Hello this.person_name).fontSize(50).fontWei…

各款单片机点亮内置LED的入“坑“指南

目录 1. Arduino Uno&#xff08;基于ATmega328P&#xff09;点亮LED的代码&#xff1a; 2. Raspberry Pi Pico&#xff08;基于RP2040&#xff09;点亮LED的代码&#xff08;使用MicroPython&#xff09;&#xff1a; 3. STM32 Nucleo&#xff08;基于多种STM32芯片&#xff0…

[VulnHub靶机渗透] CTF7

🍬 博主介绍👨‍🎓 博主介绍:大家好,我是 hacker-routing ,很高兴认识大家~ ✨主攻领域:【渗透领域】【应急响应】 【python】 【VulnHub靶场复现】【面试分析】 🎉点赞➕评论➕收藏 == 养成习惯(一键三连)😋 🎉欢迎关注💗一起学习👍一起讨论⭐️一起进步…

PMP证书要怎么考,含金量怎么样?

PMP含金量更多的是“敲门砖”作用&#xff0c;公司招聘的门槛&#xff0c;现在坐项目的大部分都需要PMP/NPDP证书。 当然现在PMP管理模式也很热门&#xff0c;对企业发展很有利&#xff0c;各大企业都有引进改良应用在公司的项目上&#xff0c;之前在校友群里面大家在讨论PMP …

ESP8266模块WIFI功能Deauther及Evil-Twin实验过程

1.下载ESP8266Flasher及deauther2.1.0_1mb.bin这个固件 2.连接ESP8266模块到电脑 设备管理器可看到成功连接的ESP8266设备 3.开始刷入固件到ESP8266模块 运行ESP8266Flasher并点击Config选择固件: 配置高级选项: 点击Flash开始刷入固件,固件成功刷入如下: 按一下ESP8266模块…

操作系统导论-课后作业-ch14

1. 代码如下&#xff1a; #include <stdio.h> #include <stdlib.h>int main() {int *i NULL;free(i);return 0; }执行结果如下&#xff1a; 可见&#xff0c;没有任何报错&#xff0c;执行完成。 2. 执行结果如下&#xff1a; 3. valgrind安装使用参考&a…

Java基础面试题-3day

Object Object类有哪些常见的方法 native 修饰符修饰的方法&#xff0c;表示这个方法我不实现&#xff0c;交给操作系统实现 getClass()&#xff1a;用于返回当前运行对象的class对象 hashCode()&#xff1a;返回对象的哈希值&#xff1b;一般用于Java的hashmap equals()&…

保姆级教程: GPTs接入广告到提现成功全过程真实记录

因为相信&#xff0c;所以看见 &#x1f31f; 1月19日&#xff0c;在AI社群首次了解到GPTs能通过接入广告获得收益。虽然对收益的多少和提现的可行性有所疑问&#xff0c;但我还是立刻在我的GPTs上尝试了这一功能。这一探索的旅程&#xff0c;如同跨入了一个未知的新世界。我的…

【江科大】STM32:旋转编码器接口

Encoder Interface 编码器接口 编码器接口可接收增量&#xff08;正交&#xff09;编码器的信号根据编码器旋转产生的正交信号脉冲&#xff0c;自动控制CNT自增或自减从而指示编码器的位置、旋转方向和旋转速度 &#xff08;PWM就是通计时器计次达到测频率的目的&#xff0c;而…

【js大坑】苹果ios的日期时间兼容问题

苹果设备上的 JavaScript 日期兼容性问题通常是由于浏览器和操作系统版本之间的差异造成的 浏览器版本&#xff1a;不同的浏览器版本可能对 JavaScript 日期的支持程度不同。一些较旧的浏览器版本可能不支持某些日期方法或属性&#xff0c;导致日期操作出现错误。操作系统版本&…

电脑文件mfc140.dll丢失的解决方法指导,怎么快速修复mfc140.dll

mfc140.dll 文件的缺失是个普遍的问题&#xff0c;在日常使用中可能会时不时遇到。本文主要目的是详细介绍一旦遇到 mfc140.dll 文件缺失&#xff0c;应该如何进行下载和安装的步骤。不再赘言&#xff0c;下面就一起深入了解mfc140.dll丢失的解决方法指导。 一. mfc140.dll的作…

【Java程序员面试专栏 专业技能篇】MySQL核心面试指引(三):性能优化策略

关于MySQL部分的核心知识进行一网打尽,包括三部分:基础知识考察、核心机制策略、性能优化策略,通过一篇文章串联面试重点,并且帮助加强日常基础知识的理解,全局思维导图如下所示 本篇Blog为第三部分:性能优化策略,子节点表示追问或同级提问 读写分离 分布式数据库的…

git 对象压缩及垃圾对象清理

git 对象压缩及垃圾对象清理 这篇文章让我们来看看 git 的对象压缩机制&#xff0c;前面的几篇文章我们提到&#xff0c;在执行 git add 命令会会把文件先通过 zlib 压缩后放入到「暂存区」&#xff0c;我们先看看这个步骤&#xff1a; 我们这个实例中有一个 1.28m 的 index.…

【数学】完全剩余系与费马小定理

完全剩余系 我们定义 a i ( 1 ≤ i ≤ n ) a_i(1\le i\le n) ai​(1≤i≤n) 为模 m m m 的完全剩余系当且仅当对于 1 ≤ i , j ≤ n 1\le i,j\le n 1≤i,j≤n 且 i ≠ j i\ne j ij&#xff0c;满足 a i ≢ a j ( m o d m ) a_i\not\equiv a_j\pmod m ai​≡aj​(mo…

短视频账号矩阵系统+无人直播系统源码技术开发

短视频账号矩阵系统无人直播系统源码技术开发涉及到多个领域&#xff0c;包括但不限于前端开发、后端开发、数据库设计、网络通信等。 以下是一些基本技术的步骤和注意事项&#xff1a; 1.技术需求分析设计&#xff1a;首先&#xff0c;需要明确开发短视频账号矩阵系统和无人直…

玩转k8s:yaml介绍

一.Yaml文件详解 1.Yaml文件格式 &#xff08;1&#xff09;Kubernetes 支持 YAML 和 JSON 格式管理资源对象 &#xff08;2&#xff09;JSON 格式&#xff1a;主要用于 api 接口之间消息的传递 &#xff08;3&#xff09;YAML 格式&#xff1a;用于配置和管理&#xff0c;…

Springboot+vue的科研工作量管理系统的设计与实现(有报告),Javaee项目,springboot vue前后端分离项目

演示视频&#xff1a; Springbootvue的科研工作量管理系统的设计与实现&#xff08;有报告&#xff09;&#xff0c;Javaee项目&#xff0c;springboot vue前后端分离项目 项目介绍&#xff1a; 本文设计了一个基于Springbootvue的前后端分离的科研工作量管理系统的设计与实现…

python_ACM模式《剑指offer刷题》链表1

题目&#xff1a; 面试tips&#xff1a; 询问面试官是否可以改变链表结构 思路&#xff1a; 1. 翻转链表&#xff0c;再遍历链表打印。 2. 想要实现先遍历后输出&#xff0c;即先进后出&#xff0c;因此可借助栈结构。 3. 可用隐式的栈结构&#xff0c;递归来实现。 代码…

从复杂数据到直观洞察:山海鲸助你一臂之力

作为山海鲸可视化的开发者&#xff0c;我们深知在数据可视化领域的挑战与机遇。山海鲸可视化软件正是我们为应对这些挑战而打造的一款强大工具&#xff0c;旨在为用户提供更高效、更直观的数据呈现方式&#xff0c;本文单纯从数据可视化角度带大家了解一下我们这款软件的优势。…