axios和fetch的对比

axiosfetch 是用于发起 HTTP 请求的两种常见工具,它们的主要区别如下:

1. 浏览器兼容性

  • axios:基于 XMLHttpRequest,兼容性较好,支持较旧的浏览器(如 IE11)。
  • fetch:现代浏览器原生支持,但不兼容 IE 等旧浏览器,可能需要 polyfill。

2. API 设计

  • axios:API 设计简洁,支持链式调用,使用 Promise,提供便捷的请求和响应拦截器。
  • fetch:API 较底层,返回 Promise,但需要手动处理 JSON 转换和状态码检查。

3. 请求和响应处理

  • axios:自动转换 JSON 数据,响应数据在 data 属性中,提供请求和响应拦截器。
  • fetch:需手动调用 .json() 方法解析 JSON,且不会自动处理错误状态码(如 404、500)。

4. 错误处理

  • axios:HTTP 错误状态码(如 404、500)会触发 catch,便于统一处理。
  • fetch:仅在网络故障时触发 catch,HTTP 错误状态码需手动处理。

5. 取消请求

  • axios:支持通过 CancelTokenAbortController 取消请求。
  • fetch:仅支持 AbortController 取消请求。

6. 进度监控

  • axios:支持上传和下载进度监控。
  • fetch:不直接支持进度监控,需通过其他方式实现。

7. 体积

  • axios:体积较大(约 13KB)。
  • fetch:原生支持,无需额外引入。

示例代码

axios
axios.get('https://api.example.com/data').then(response => console.log(response.data)).catch(error => console.error(error));
fetch
fetch('https://api.example.com/data').then(response => {if (!response.ok) throw new Error('Network response was not ok');return response.json();}).then(data => console.log(data)).catch(error => console.error(error));

总结

  • axios:功能丰富,使用方便,适合复杂场景。
  • fetch:轻量、现代,适合简单场景或对包大小敏感的项目。

根据项目需求选择合适的工具。

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

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

相关文章

Java Timer定时任务源码分析

前言 Java 提供的java.util.Timer类可以用来执行延时任务,任务可以只执行一次,也可以周期性的按照固定的速率或延时来执行。 实现一个延时任务调度器,核心有两点: 如何存储延时任务如何调度执行延时任务 源码分析 TimerTask …

【安全运营】用户与实体行为分析(UEBA)浅析

目录 用户与实体行为分析(UEBA)简介一、UEBA的核心概念1. 行为基线建立2. 异常检测3. 风险评分4. 上下文关联 二、UEBA的应用场景1. 内部威胁检测2. 外部威胁应对3. 合规性和审计支持 三、UEBA的技术实现1. 大数据技术2. 机器学习算法3. 可视化工具 四、…

系统思考—啤酒游戏经营决策沙盘模拟

再次感谢文华学院的邀请,为经纬集团管理层带来 《啤酒游戏经营决策沙盘》! 很多朋友问:“最近是不是啤酒游戏上的少了?” 其实,真正的关键不是游戏本身,而是——如何让大家真正看见复杂系统中的隐性结构。 …

排序算法实现:插入排序与希尔排序

目录 一、引言 二、代码整体结构 三、宏定义与头文件 四、插入排序函数(Insertsort) 函数作用 代码要点分析 五、希尔排序函数(ShellSort) 函数作用 代码要点分析 六、打印数组函数(PrintSort&#x…

redis的key是如何找到对应存储的数据原理

在 Redis 中,Key 是数据的唯一标识符,而 Value 是与 Key 关联的实际数据。Redis 通过高效的键值对存储机制,能够快速定位和访问数据。以下是 Redis 如何通过 Key 找到对应存储数据的详细解析: 1. Redis 的数据存储结构 Redis 是一个基于内存的键值存储系统,其核心数据结构…

github上传本地文件到远程仓库(空仓库/已有文件的仓库)

今天搞自己本地训练的代码到仓库留个档,结果遇到了好多问题,到腾了半天才搞明白整个过程,留在这里记录一下。 远程空仓库 主要根据官方教程:Adding locally hosted code to GitHub - GitHub Docs #1. cd到你需要上传的文件夹&a…

Redis数据类型详解

Redis数据类型详解 Redis 共有 5 种基本数据类型:String(字符串)、List(列表)、Set(集合)、Hash(散列)、Zset(有序集合)。 除了 5 种基本的数据…

【第13章】亿级电商平台订单系统-高性能之异步架构设计

1-1 本章导学 课程导学 学习目标:掌握大型系统架构设计难点之高性能异步架构设计项目落地:订单系统高性能异步架构设计(年交易200亿B2B电商平台)本章主要内容 1. 为何需要异步消息架构 分析同步架构的性能瓶颈异步架构对系统解耦与性能提升的核心价值2. 确定异步消息技术…

2025-03-20 学习记录--C/C++-C 库函数 - toupper()、tolower()、 isspace()

合抱之木&#xff0c;生于毫末&#xff1b;九层之台&#xff0c;起于累土&#xff1b;千里之行&#xff0c;始于足下。&#x1f4aa;&#x1f3fb; 一、C 库函数 - toupper() ⭐️ C 标准库 - <ctype.h> C 标准库的 ctype.h 头文件提供了一些函数&#xff0c;可用于测试和…

LoRaWAN技术解析

LoRaWAN&#xff08;Long Range Wide Area Network&#xff09;是一种基于 LoRa&#xff08;Long Range&#xff09;技术的低功耗广域网络协议&#xff0c;专为物联网&#xff08;IoT&#xff09;设备的无线通信而设计。它是一种开放的、标准化的通信协议&#xff0c;支持大规模…

织梦DedeCMS如何获得在列表和文章页获得顶级或上级栏目名称

获得顶级或二级栏目的名称&#xff0c;都需要修改php文件&#xff0c;修改的文件【/include/common.func.php】将代码插入到这个文件的最下面即可&#xff1b; 一、获得当前文章或栏目的【顶级栏目】名称 1、插入顶级栏目代段 //获取顶级栏目名 function GetTopTypename($id…

虚幻基础:ue自定义类

文章目录 Gameplay Tag&#xff1a;ue标签类创建&#xff1a;其他-数据表格-gameplaytag安装&#xff1a;项目设置&#xff1a;gamePlayTag&#xff1a;gamePlay标签列表使用&#xff1a;变量类型&#xff1a;gamePlayTag primary data asset&#xff1a;ue数据类&#xff1a;通…

易语言模拟真人鼠标轨迹算法

一.简介 鼠标轨迹算法是一种模拟人类鼠标操作的程序&#xff0c;它能够模拟出自然而真实的鼠标移动路径。 鼠标轨迹算法的底层实现采用C/C语言&#xff0c;原因在于C/C提供了高性能的执行能力和直接访问操作系统底层资源的能力。 鼠标轨迹算法具有以下优势&#xff1a; 模拟…

Matplotlib 柱形图

Matplotlib 柱形图 引言 在数据可视化领域&#xff0c;柱形图是一种非常常见且强大的图表类型。它能够帮助我们直观地比较不同类别或组之间的数据大小。Matplotlib&#xff0c;作为Python中最受欢迎的数据可视化库之一&#xff0c;提供了丰富的绘图功能&#xff0c;其中包括创…

sparksql的Transformation与 Action操作

Transformation操作 与RDD类似的操作 map、filter、flatMap、mapPartitions、sample、 randomSplit、 limit、 distinct、dropDuplicates、describe&#xff0c;而以上这些都是企业中比较常用的&#xff0c;这里在一个文件中统一论述 val df1 spark.read.json("src/m…

微软Data Formulator:用AI重塑数据可视化的未来

在数据驱动的时代,如何快速将复杂数据转化为直观的图表是每个分析师面临的挑战。微软研究院推出的开源工具 Data Formulator,通过结合AI与交互式界面,重新定义了数据可视化的工作流。本文将深入解析这一工具的核心功能、安装方法及使用技巧,助你轻松驾驭数据之美。 一、Dat…

20分钟上手DeepSeek开发:SpringBoot + Vue2快速构建AI对话系统

20分钟上手DeepSeek开发&#xff1a;SpringBoot Vue2快速构建AI对话系统 前言 在生成式AI技术蓬勃发展的今天&#xff0c;大语言模型已成为企业智能化转型和个人效率提升的核心驱动力。作为国产大模型的优秀代表&#xff0c;DeepSeek凭借其卓越的中文语义理解能力和开发者友…

神经网络中层与层之间的关联

目录 1. 层与层之间的核心关联&#xff1a;数据流动与参数传递 1.1 数据流动&#xff08;Forward Propagation&#xff09; 1.2 参数传递&#xff08;Backward Propagation&#xff09; 2. 常见层与层之间的关联模式 2.1 典型全连接网络&#xff08;如手写数字分类&#xf…

本地部署deepseek-r1建立向量知识库和知识库检索实践【代码】

目录 一、本地部署DS 二、建立本地知识库 1.安装python和必要的库 2.设置主目录工作区 3.编写文档解析脚本 4.构建向量数据库 三、基于DS,使用本地知识库检索 本地部署DS,其实非常简单,我写了一篇操作记录,我终于本地部署了DeepSeek-R1(图文全过程)-CSDN博客 安装…

String、StringBuffer、StringBuiler的区别

可变性 String是不可变的&#xff0c;这是因为String内部用于存储数据的char[]数组用了final关键字修饰&#xff0c;而且是private的&#xff0c;并且没有对外提供修改数组的方法。 StringBuffer和StringBuilder是可变的&#xff0c;它们内部的char数组没有用final关键字修饰。…