AJAX笔记（二）Fetch和axios

最新推荐文章于 2024-11-11 22:05:17 发布
最新推荐文章于 2024-11-11 22:05:17 发布
阅读量408 收藏 1
点赞数
分类专栏： AJAX 文章标签： ajax json javascript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_44356698/article/details/129048481
版权

1、Fetch

1.1、XMLHttpRequest的缺陷

在这里插入图片描述

1.2、fetch的get写法

在这里插入图片描述

1.3、fetch的post写法

在这里插入图片描述

1.4、fetch的put写法

在这里插入图片描述

1.5、fetch的patch写法

在这里插入图片描述

1.6、fetch的delete写法

在这里插入图片描述

2、axios

2.1、axios的介绍

在这里插入图片描述

2.2、axios的get写法

在这里插入图片描述

2.3、axios的post写法（图一json写法和图二三form写法）

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

2.4、axios的put写法

在这里插入图片描述

2.5、axios的patch写法

在这里插入图片描述

2.6、axios的delete写法

在这里插入图片描述

2.7、axios的配置写法

在这里插入图片描述

2.8、axios前置拦截器（请求拦截器）和后置拦截器（响应拦截器）

1、使用场景：
（1）前置拦截器：发送请求需要带上token，可以写一个前置拦截器，一次搞定、发请求显示loading圈；
在这里插入图片描述
（2）后置拦截器：失败请求的统一处理、响应后取消loading圈
在这里插入图片描述

2.8、axios中断器

应用场景：请求a页面后，又快速点击请求b页面，此时使用中断器中断a的请求
在这里插入图片描述

weixin_44356698
关注
专栏目录
前端中axios提供的前置拦截器和后置拦截器(前后端分离项目结合使用 ---- 见上篇博文)
csdn_shilin的博客
10-21 2823
给每个axios请求都添加一个前置拦截器，发送请求时添加请求头，在第一次后台发给前台一个jsessionid后，前台永久保存在浏览器端，在第二次...第n次进行操作发送请求时，都把 这个jsessionid传给后台，就可以获取到已登录用户，进行操作 （有些功能是必须登录才能操作的. ） //1 使用axios前置拦截器，让所有的请求都携带token axios.interceptors.request.use(config=>{ //携带token let uToken = loc
react 使用ajax axios,react中使用Ajax请求（axios，Fetch）
weixin_42515841的博客
08-06 1323
React本身只关注于界面, 并不包含发送ajax请求的代码，前端应用需要通过ajax请求与后台进行交互(json数据)，可以使用集成第三方ajax库(或自己封装)常用的ajax请求库jQuery: 比较重, 如果需要另外引入不建议使用axios: 轻量级, 建议使用，封装XmlHttpRequest对象的ajax，promise风格，可以用在浏览器端和node服务器端fetch: 原生函数, 但...
【ajax实战03】拦截器
大前端开发工程师、互联网方向创业者
06-26 531
请求拦截器与响应拦截器的使用
请说明Ajax、Fetch、Axios三者的区别
weixin_43850639的博客
03-12 1892
队列则不同，它基于地址指针进行遍历，而且可以从头或尾部开始遍历，但不能同时遍历，无需开辟临时空间，因为在遍历的过程中不影像数据结构，速度要快的多。栈只能从头部取数据，也就最先放入的需要遍历整个栈最后才能取出来，而且在遍历数据的时候还得为数据开辟临时空间，保持数据在遍历前的一致性。看到“请说明Ajax、Fetch、Axios三者的区别”这个问题我就想起来另一个面试题：栈、队列、数组有什么区别？1、Ajax只是个技术统称，可以用XMLHttpRequest来实现Ajax，也可以用用Fetch来实现Ajax。
Ajax、Fetch、Axios三者的区别
前端学习博客
05-07 2803
Ajax、Fetch、Axios三者的区别 文章目录Ajax、Fetch、Axios三者的区别AjaxFetchAxios三者对比：为什么比起 fetch 更倾向于选择 Axios1.浏览器兼容方面2.请求取消3.JSON结果转换4.拦截器5.CSRF保护 Ajax ajax基本知识点 👉Ajax学习笔记 本身是针对MVC的编程,不符合现在前端MVVM的浪潮 Ajax 是一种思想，XMLHttpRequest 只是实现 Ajax 的一种方式。其中 XMLHttpRequest 模块就是实现 Ajax 的一
ajax、fetch和axios的区别
L_Juan_Y的博客
09-22 145
一、jQuery ajax 1.介绍 统 Ajax 指的是 XMLHttpRequest（XHR），核心使用XMLHttpRequest对象； 增加了对JSONP的支持 2.缺点 本身是针对MVC的编程,不符合现在前端**MVVM(Model-View-ViewModel)**的浪潮； VVM 的核心是 ViewModel 层，它就像是一个中转站（value converter），负责转换 Model 中的数据对象来让数据变得更容易管理和使用； ViewModel 层向上与视图层进行双向数据绑定，向
【个人笔记】AJAX和Axios
qq_63856835的博客
07-10 528
AJAX（Asynchronous JavaScript and XML）和 Axios 是前端开发中用于异步数据交换的两种不同技术。虽然它们都用于实现异步请求，但在实现方式、功能、性能和易用性方面存在一些关键区别。让我们详细探讨这两个概念及其差异。
前端Ajax、Axios和Fetch的用法和区别笔记
这是一个web全栈开发的博客，取其精华去其糟粕，争取让大家一看就懂，一学就会，一用就成~
05-28 1136
前端 JavaScript 开发中，进行 HTTP 请求的三种主要方式是 Ajax、Axios 和 Fetch。这三种方式各有优缺点，并且适用于不同的场景。在合适的业务场景下使用，以下是它们的区别和使用举例。
Ajax&Json笔记，axios
zhansan的博客
07-16 116
这意味着可以在不重新加载整个网页的情况下，对网页的某部分进行更新。var person = {“name”: “张三”, age: 23, ‘gender’: true};var p = {“name”:“张三”,“age”:23,“gender”:“男”};Ajax 是一种在无需重新加载整个网页的情况下，能够更新部分网页的技术。//data: “username=jack&age=23”,//请求参数。},//表示如果请求响应出现错误，会执行的回调函数。type:“POST” , //请求方式。
ajax和fetch、axios的区别以及axios原理
黑黑黑眼圈博客
04-04 918
从原生的XHR到jquery ajax，再到现在的axios和fetch，究竟发生了哪些变化，我们接下来就来探讨一下。 jquery ajax 它是对原生XHR的封装，随着vue、react框架的兴起，很多情况下我们只需使用ajax可是却要引入整个jquery，这是非常不合理。 $.ajax({ type:'POST', url:url, data:data, dataType:dataT...
ajax尚硅谷笔记——跨域请求、axios发送ajax请求、jquery发送ajax请求
weixin_53317758的博客
11-21 2156
script标签作为函数被服务调用，其中加上该函数的参数作为用户需要看到的数据内容
【AJAX 学习笔记】多种方式发送AJAX请求（原生AJAX、jQuery、axios、fetch）
w的博客
08-14 1712
Ajax 学习笔记 1 AJAX相关概述 1.1 AJAX简介 AJAX 全称为Asynchronous JavaScript And XML ，就是异步的 JS 和 XML 。 通过 AJAX 可以在浏览器中向服务器发送异步请求，最大的优势：无刷新获取数据。 AJAX 不是新的编程语言，而是一种将现有的标准组合在一起使用的新方式。 1.2 XML简介 XML 可扩展标记语言。 XML 被设计用来传输和存储数据。（而HTML是用来呈现数据）。 XML 和 HTML 类似，不同的
ajax，fetch，axios测试用例
人间草木
01-22 233
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <meta http-equ...
【vue详细笔记】vue之前后端交互（promise、fetch、axios）
马云
11-05 474
vue前后端交互 文章目录vue前后端交互一、前后端交互模式1、接口调用方式2、URL地址格式3、Restful形式的URL二、Promise1、异步调用异步效果分析2、Promise三、fetch1、基本特性2、语法3、fetch请求参数常用配置选项GET请求参数传递DELETE请求参数传递POST请求参数传递PUT请求参数传递4、fetch响应结果四、axios1、axios基本用法2、axios请求参数GET请求参数传递DELETE请求参数传递POST请求参数传递PUT请求参数传递3、axios的响应
AJAX 全面教程：从基础到高级
孤客科技
11-07 912
AJAX（Asynchronous JavaScript and XML）是一种用于创建快速动态网页的技术。它允许网页在不重新加载整个页面的情况下，与服务器进行异步通信。AJAX 的核心在于 JavaScript 和 XMLHttpRequest 对象的使用，虽然现在 JSON 逐渐取代了 XML，但 AJAX 的概念依然适用。AJAX 是现代网页开发中不可或缺的技术，通过异步请求提升用户体验和网页性能。
SparkSql读取数据的方式
weixin_64860388的博客
11-05 724
此处的pyspark更像是一个客户端，里面可以通过python编写spark代码而已。而我们以前安装的pyspark更像是spark的python运行环境。不要在一个python 文件中，创建两个不同的sparkSession对象，否则对于sparksql获取hive的元数据，有影响。第二种情况：linux环境下，按照如下方式进行。方式二：直接调用对应数据源类型的方法。方式一：给定读取数据源的类型和地址。1）集群环境操作hive。
Ajax异步调用
最新发布
2301_80768157的博客
11-11 459
Ajax全称是Asynchronous Javascript and XML，即异步的JavaScript和 XML。Ajax是一种Web应用技术，该技术是在JavaScript、DOM、服务器配合下，实现浏览器向服务器发送异步请求。Ajax技术用于页面的局部更新，同步调用会对客户使用造成影响，比如当你想获取一张图片时，页面需要通过一系列请求，之后浏览器把整个页面重新发送，花费时间长。异步调用便解决了这个我问题。
axios平替！用浏览器自带的fetch处理AJAX（兼容表单/JSON/文件上传）
集成显卡的开源主页 https://github.com/0604hx
11-11 148
fetch 函数是 JavaScript 中用于发送网络请求的内置 API，可以替代传统的 XMLHttpRequest。它可以发送 HTTP 请求（如 GET、POST 等），并返回一个 Promise，从而简化异步操作。
spark的学习-06
qq_62984376的博客
11-11 624
方式一：给定读取数据源的类型和地址方式二：直接调用对应数据源类型的方法特殊参数：option，用于指定读取时的一些配置选项。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值