Deprecated: imwpcache\f884414bce24ee67f\f73723ec7b1919fa5::__construct(): Implicitly marking parameter $YECBGYFECGEAFWHA as nullable is deprecated, the explicit nullable type must be used instead in /www/wwwroot/www.chuangxiangniao.com/wp-content/plugins/imwpcache-dist/build/f884414bce24ee67ff73723ec7b1919fa5.php on line 2

Deprecated: imwpcache\f884414bce24ee67f\f73723ec7b1919fa5::__construct(): Implicitly marking parameter $BBWFDDBHHYHDXXAB as nullable is deprecated, the explicit nullable type must be used instead in /www/wwwroot/www.chuangxiangniao.com/wp-content/plugins/imwpcache-dist/build/f884414bce24ee67ff73723ec7b1919fa5.php on line 2
Axios 与 Fetch_创想鸟

Axios 与 Fetch

axios 与 fetch

葡萄牙语版本

axios 和 fetch 是在 javascript 中发出 http 请求的流行工具,但它们有一些关键的区别。总结如下:

阿克西奥斯

内置功能:axios 具有许多内置功能,例如自动 json 转换、请求和响应拦截器以及请求取消。浏览器兼容性:支持旧版浏览器,包括 internet explorer。错误处理:axios 自动拒绝 http 错误状态(例如 404 或 500)的 promise,使错误处理更容易。请求/响应拦截器:允许您以简单的方式全局修改请求或响应。​​请求取消:axios 提供了一种简单的方法来取消请求。

拿来

原生 api:fetch 是原生 web api,这意味着无需安装额外的库。promise-based:使用promise,但需要手动检查响应状态是否有错误。流处理:fetch 支持流,这对于处理大型响应非常有用。更多控制:提供对请求的更多控制,但需要更多额外代码来实现设置模式或拦截请求等功能。没有内置对 json 的支持:您需要在响应对象上调用 .json() 来解析 json 数据。

使用案例

如果您需要一组丰富的开箱即用功能,特别是对于复杂的应用程序,请使用 axios。使用 fetch 来实现更简单的用例或当您想避免外部依赖时。

使用示例

axios:

axios.get('/api/data')  .then(response => console.log(response.data))  .catch(error => console.error(error));const options = {  url: 'http://localhost/test.htm',  method: 'post',  headers: {    'accept': 'application/json',    'content-type': 'application/json;charset=utf-8'  },  data: {    a: 10,    b: 20  }};axios(options)  .then(response => {    console.log(response.status);  });

获取:

fetch('/api/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));const url = "https://jsonplaceholder.typicode.com/todos";const options = {  method: "POST",  headers: {    Accept: "application/json",    "Content-Type": "application/json;charset=UTF-8",  },  body: JSON.stringify({    a: 10,    b: 20,  }),};fetch(url, options)  .then((response) => response.json())  .then((data) => {    console.log(data);  });

笔记:

为了发送数据,fetch() 使用 post 请求的 body 属性,而 axios 使用 data 属性。使用 json.stringify 方法将 fetch() 中的数据转换为字符串。axios 会自动转换服务器返回的数据,但使用 fetch() 时,需要调用 response.json() 方法将数据解析为 javascript 对象。使用 axios,可以在数据对象内访问服务器提供的数据响应,而在 fetch() 方法中,最终的数据可以用任意变量命名。

结论

两者都有各自的优点,选择通常取决于您的具体需求和偏好。如果您正在构建具有大量 api 交互的大型应用程序,axios 可以使某些任务变得更容易,而 fetch 非常适合简单的任务。

axios 提供了一个用户友好的 api,可以简化大多数 http 通信任务。但是,如果您更喜欢使用本机浏览器功能,您绝对可以使用 fetch api 自己实现类似的功能。

正如我们所探索的,使用浏览器中可用的 fetch() 方法复制 axios 的核心功能是完全可行的。包含客户端 http 库的决定最终取决于您对本机 api 的舒适度以及项目的具体要求。

更多信息:https://medium.com/trainingcenter/axios-ou-fetch-765e5db9dd59

以上就是Axios 与 Fetch的详细内容,更多请关注创想鸟其它相关文章!

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。
如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至 chuangxiangniao@163.com 举报,一经查实,本站将立刻删除。
发布者:程序猿,转转请注明出处:https://www.chuangxiangniao.com/p/1491898.html

赞 (0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
了解 React 的内置状态管理
上一篇 2025年12月19日 14:21:41
估计算法的运行时间(第 2 部分)
下一篇 2025年12月19日 14:21:50

相关推荐

  • yii的事件是什么

    yii的事件是什么yii的事件是什么yii的事件是什么yii的事件是什么

    事件(Events) 事件是可以将自定义代码“注入”到现有代码中的特定执行点。 附加自定义代码到某个事件,当这个事件被触发时,这些代码就会自动执行。          (推荐学习:yii教程) 例如,邮件程序对象成功发出消息时可触发 messageSent 事件。如想追踪成功发送的消息,可以附加相应…

    2026年9月25日 • 用户投稿
    000
  • DWG转DXF为何非真彩色

    DWG转DXF为何非真彩色DWG转DXF为何非真彩色DWG转DXF为何非真彩色DWG转DXF为何非真彩色

    1、 null 2、 当在CAD中将DWG文件转换为DXF格式时,若发现对象颜色未保留真彩色,可能是因为打印配置中应用了monochrome.ctb样式表,该设置会强制输出为黑白图形,而非原始彩色。 3、 在导出至ACAD格式时,可利用图层映射功能,将SolidWorks中的不同对象指派到特定图层,…

    2026年9月25日 • 用户投稿
    000
  • x浏览器怎么开启或关闭多线程下载_x浏览器下载管理器多线程设置

    x浏览器怎么开启或关闭多线程下载_x浏览器下载管理器多线程设置x浏览器怎么开启或关闭多线程下载_x浏览器下载管理器多线程设置x浏览器怎么开启或关闭多线程下载_x浏览器下载管理器多线程设置x浏览器怎么开启或关闭多线程下载_x浏览器下载管理器多线程设置

    答案:可通过调整x浏览器多线程设置提升下载速度。依次进入设置→下载管理器→多线程下载,选择合适线程数以平衡速度与稳定性,关闭则设为1或关闭选项。 如果您在使用x浏览器下载文件时发现速度较慢或希望提升下载效率,可以通过调整多线程下载设置来优化下载性能。多线程下载能够将文件分割成多个部分并行下载,从而加…

    2026年9月25日 • 用户投稿
    000
  • mysql怎么插数据命令行语句

    如何使用 mysql 命令行插入数据 在 MySQL 中,可以使用以下 INSERT 语句将数据插入到数据库中: INSERT INTO table_name (column1, column2, …) VALUES (value1, value2, …); 其中: table_name 是…

    2026年9月25日
    100
  • Win7系统如何给文件夹设置密码?

    Win7系统如何给文件夹设置密码?Win7系统如何给文件夹设置密码?Win7系统如何给文件夹设置密码?Win7系统如何给文件夹设置密码?

    我们如今对电脑的依赖程度越来越高,无论是日常生活、工作还是学习都离不开它。而在使用过程中,我们会存储许多重要的文件在电脑里,但如果希望这些文件不被他人查看,该怎么做呢?当然,给文件夹加个密码是最直接的办法。今天,我们就一起来看看如何为文件夹设置密码吧! 前几天,我在浏览网页时发现有很多网友都在讨论如…

    2026年9月25日 • 用户投稿
    100
  • Hibernate/Spring Boot中复合主键与多对多关联的实现指南

    Hibernate/Spring Boot中复合主键与多对多关联的实现指南Hibernate/Spring Boot中复合主键与多对多关联的实现指南Hibernate/Spring Boot中复合主键与多对多关联的实现指南Hibernate/Spring Boot中复合主键与多对多关联的实现指南

    本教程详细阐述了在Spring Boot和Hibernate框架中,如何优雅地处理具有附加属性的多对多关系,特别是当连接表需要复合主键时。我们将通过构建一个用户电影评分系统为例,深入探讨@EmbeddedId、@Embeddable以及@OneToMany、@ManyToOne等JPA注解的实际应用…

    2026年9月25日 • 用户投稿
    000
  • 如何自定义debian readdir的输出格式

    如何自定义debian readdir的输出格式如何自定义debian readdir的输出格式如何自定义debian readdir的输出格式如何自定义debian readdir的输出格式

    本文介绍几种在Debian系统中自定义readdir输出格式的方法,readdir是用于读取目录内容的系统调用。 方法一:使用opendir和readdir函数 以下C程序演示如何使用opendir和readdir函数读取目录并自定义输出: #include #include #include #i…

    2026年9月25日 • 用户投稿
    400
  • sublime的goto symbol in project功能怎么用_sublime Goto Symbol in Project使用方法

    sublime的goto symbol in project功能怎么用_sublime Goto Symbol in Project使用方法sublime的goto symbol in project功能怎么用_sublime Goto Symbol in Project使用方法sublime的goto symbol in project功能怎么用_sublime Goto Symbol in Project使用方法sublime的goto symbol in project功能怎么用_sublime Goto Symbol in Project使用方法

    使用快捷键Ctrl+Shift+R(Win/Linux)或Cmd+Shift+R(Mac)可快速调用Goto Symbol in Project功能,通过搜索符号名称跳转到函数、类等定义位置,支持模糊匹配与实时过滤,需确保项目已添加至侧边栏且语法包正确安装以保证索引识别效果。 Sublime Tex…

    2026年9月25日 • 用户投稿
    100
  • Debian Context支持哪些编程语言

    Debian Context支持哪些编程语言Debian Context支持哪些编程语言Debian Context支持哪些编程语言Debian Context支持哪些编程语言

    Debian Linux系统并非直接“支持”特定编程语言,而是提供了一个运行各种编程语言的理想环境。以下列举几种在Debian上广泛使用的编程语言及其应用场景: 主流编程语言及应用 Python: 以其简洁的语法和强大的功能著称,广泛应用于数据科学、Web开发、自动化运维等领域。丰富的第三方库使其成…

    2026年9月25日 • 用户投稿
    100
  • 【新手入门】使用ERNIE-4.5-0.3B-Paddle从原始文本构建知识图谱

    1. 概述 本文将探讨如何使用ernie-4.5-0.3b-paddle模型从原始文本构建知识图谱。通过结合大语言模型(llm)和检索增强生成(rag)技术实现文本生成,帮助我们从非结构化数据中高效提取实体和关系信息。 2. 什么是知识图谱? 2.1 基本概念 知识图谱是一种语义网络,它表示和连接现…

    2026年9月25日
    000
  • 苹果手机怎么查看本机号码

    苹果手机怎么查看本机号码苹果手机怎么查看本机号码苹果手机怎么查看本机号码苹果手机怎么查看本机号码

    iPhone查看本机号码有三种方法:拨号键盘:查看屏幕左上角的数字。设置应用:点击“电话”>“我的号码”。SIM卡设置:点击“蜂窝网络”>“SIM卡”>“电话号码”。 苹果手机查看本机号码的方法 方法一:拨号键盘 打开iPhone上的电话应用。点击拨号键盘选项卡。查看屏幕左上角的数…

    2026年9月25日 • 用户投稿
    100
  • 淘宝搜索图片入口在哪里?如何推广店铺?淘宝商家必读:快速找到搜索图片入口及高效推广店铺指南

    淘宝搜索图片入口在哪里?如何推广店铺?淘宝商家必读:快速找到搜索图片入口及高效推广店铺指南淘宝搜索图片入口在哪里?如何推广店铺?淘宝商家必读:快速找到搜索图片入口及高效推广店铺指南淘宝搜索图片入口在哪里?如何推广店铺?淘宝商家必读:快速找到搜索图片入口及高效推广店铺指南淘宝搜索图片入口在哪里?如何推广店铺?淘宝商家必读:快速找到搜索图片入口及高效推广店铺指南

    在淘宝平台实现精准流量获取是商家运营的核心环节,而图片搜索功能让用户能够通过上传商品图片快速找到同款商品,为店铺带来了极具价值的曝光机会。本文将全面介绍图片搜索的入口位置,并深入分享7大关键推广策略,助力店铺有效提升转化率。 一、淘宝图片搜索入口详解 1.1 手机端操作方式 打开淘宝APP → 点击…

    2026年9月25日 • 用户投稿
    300
  • 解决Android Studio Gradle构建问题的网络仓库配置指南

    解决Android Studio Gradle构建问题的网络仓库配置指南解决Android Studio Gradle构建问题的网络仓库配置指南解决Android Studio Gradle构建问题的网络仓库配置指南解决Android Studio Gradle构建问题的网络仓库配置指南

    本文旨在解决Android Studio项目中因网络限制导致的Gradle构建失败问题,特别是“插件未找到”等错误。核心解决方案是通过配置替代的Maven仓库(如阿里云镜像)来绕过网络障碍,确保Gradle能够成功解析和下载所需的插件与依赖,从而恢复项目的正常构建。 1. 问题背景与常见症状 在an…

    2026年9月25日 • 用户投稿
    000
  • mysql创建数据库提示已存在怎么回事

    mysql创建数据库提示已存在怎么回事mysql创建数据库提示已存在怎么回事mysql创建数据库提示已存在怎么回事mysql创建数据库提示已存在怎么回事

    MySQL 创建数据库提示已存在的原因包括:数据库名称冲突、大小写敏感性、特殊字符限制、连接错误、权限问题、命名冲突和表名冲突。请检查并解决这些潜在原因。 MySQL 创建数据库提示已存在的原因 创建 MySQL 数据库时出现 “已存在” 提示,通常有以下几个原因: 1. 数…

    2026年9月25日 • 用户投稿
    000
  • AI Overviews适合初学者使用吗 功能易用性与学习曲线评估

    AI Overviews适合初学者使用吗 功能易用性与学习曲线评估AI Overviews适合初学者使用吗 功能易用性与学习曲线评估AI Overviews适合初学者使用吗 功能易用性与学习曲线评估AI Overviews适合初学者使用吗 功能易用性与学习曲线评估

    AI Overviews作为一项新兴功能,许多初学者对其适用性感到好奇。本文旨在评估AI Overviews对于初学者而言是否友好,将从功能易用性和学习曲线两个方面进行深入探讨。文章会详细解析其操作流程,帮助用户理解并掌握如何有效地使用这项功能,从而解决标题中关于其适合初学者使用的问题。 ☞☞☞AI…

    2026年9月25日 • 用户投稿
    200
  • sublime如何快速切换项目 _sublime项目快速切换方法

    sublime如何快速切换项目 _sublime项目快速切换方法sublime如何快速切换项目 _sublime项目快速切换方法sublime如何快速切换项目 _sublime项目快速切换方法sublime如何快速切换项目 _sublime项目快速切换方法

    使用命令面板输入“Switch Project”可快速切换项目;2. 通过设置快捷键如Ctrl+Alt+P实现一键切换;3. 需先保存项目为.sublime-project文件才能在列表中显示;4. 也可通过菜单Project→Recent Projects用鼠标选择最近项目。掌握这些方法可高效管理…

    2026年9月25日 • 用户投稿
    000
  • MAC怎么快速切换不同的音频输出设备_Mac菜单栏音量图标切换声音输出

    MAC怎么快速切换不同的音频输出设备_Mac菜单栏音量图标切换声音输出MAC怎么快速切换不同的音频输出设备_Mac菜单栏音量图标切换声音输出MAC怎么快速切换不同的音频输出设备_Mac菜单栏音量图标切换声音输出MAC怎么快速切换不同的音频输出设备_Mac菜单栏音量图标切换声音输出

    通过菜单栏音量图标可快速切换音频输出设备,点击音量图标并选择目标设备即可生效;2. 使用快捷键与自动化工具如Keyboard Maestro或快捷指令创建AppleScript脚本,一键切换指定设备;3. 进入系统设置→声音→输出,手动选择设备,适用于初次配置或排查问题。 如果您在Mac上连接了多个…

    2026年9月25日 • 用户投稿
    100
  • 谷歌浏览器开发者工具网络面板数据延迟如何修复

    谷歌浏览器开发者工具网络面板数据延迟如何修复谷歌浏览器开发者工具网络面板数据延迟如何修复谷歌浏览器开发者工具网络面板数据延迟如何修复谷歌浏览器开发者工具网络面板数据延迟如何修复

    延迟通常由网络环境、浏览器状态或页面性能导致。先通过Waterfall分析DNS、TCP等阶段耗时,确认是否真实延迟;更换网络或设备对比速度;清除缓存、禁用缓存或使用无痕模式排除干扰;检查代理设置并切换为公共DNS;最后结合Performance面板排查脚本阻塞与资源瓶颈。 Chrome开发者工具网…

    2026年9月25日 • 用户投稿
    800
  • PHP一键环境如何配置Memcached_Memcached缓存集成

    首先安装Memcached服务并启动,然后启用PHP的memcached扩展并重启服务,最后通过PHP代码连接并测试缓存读写;具体步骤包括:Windows或Linux系统下安装Memcached服务,确保端口11211监听;在宝塔等环境中安装php-memcached扩展并确认phpinfo显示模块…

    2026年9月25日
    000
  • thinkphp开发用什么IDE?

    thinkphp开发用什么IDE?thinkphp开发用什么IDE?thinkphp开发用什么IDE?thinkphp开发用什么IDE?

    thinkphp开发用什么ide? Zend Studio Zend Studio是一款来自Zend公司旗下的一款经典PHP IDE。 Zend Studio是一个屡获大奖的专业PHP集成开发环境,具备功能强大的专业编辑工具和调试工具,支持PHP语法加亮显示,支持语法自动填充功能,支持书签功能,支持…

    2026年9月25日 • 用户投稿
    200

发表回复

登录后才能评论
关注微信