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

Ajax fetch Axios 的区别

AJAX:一种创建交互式网页应用的网页执行交互技术

通过在后台与服务器进行少量数据交换,Ajax可以使网页实现异步更新。意味着:在不重新加载整个网页 的情况下,对网页某部分进行更新。

缺点:

针对MVC编程,不符合前端MVVM;基于原生XHR;配置和调用方式非常混乱,基于事件的异步模型不友好;

Fetch:

ES6中的promise对象,不是ajax进一步封装,而是原生js,没有使用XMLHttpRequest对象。

fetch 语法简洁,更加语义化;基于标准Promise实现,支持async/await 

缺点:

① fetch 只对网络请求报错,对400,500 都当做成功的请求,服务器返回400,500 错误码时不会reject,只有网络错误这些导致请求不能完成时,fetch才会被 reject。

② fetch 默 认 不 会 带 cookie , 需 要 添 加 配 置 项 : fetch(url, {credentials: 'include'})。

③ fetch 不 支 持 abort , 不 支 持 超 时 控 制 , 使 用 setTimeout 及 Promise.reject 的实现的超时控制并不能阻止请求过程继续在后台 运行,造成了流量的浪费。
④ fetch 没有办法原生监测请求的进度,而 XHR 可以。

(3)Axios 是一种基于Promise封装的HTTP客户端

浏览器发起XMLHttpRequest

node端发起http请求

支持promise API

监听请求和返回

对请求和返回进行转化

取消请求

自动转化json数据

客户端支持低于XSRF攻击

相关文章:

Ajax fetch Axios 的区别

AJAX:一种创建交互式网页应用的网页执行交互技术 通过在后台与服务器进行少量数据交换,Ajax可以使网页实现异步更新。意味着:在不重新加载整个网页 的情况下,对网页某部分进行更新。 缺点: 针对MVC编程,…...

数据库结构差异对比工具

简介 前几年写了一个数据库对比工具,但是由于实现方式的原因,数据库支持有限,所以重新设计了一下,便于支持多种数据库,并且更新了UI。 新版地址:https://gitee.com/xgpxg/db-diff 旧版地址:h…...

Shell编程学习之breakcontinuereturn的应用

Shell编程中的break关键字&#xff1a;break关键字&#xff1a;退出最近的循环&#xff0c;后续循环不再执行&#xff1b;break关键字用法&#xff1a; break #结束本层循环 break 数字n #结束n层循环测试代码1&#xff1a; #!/bin/bashfor((i1;i<6;i)) dofor((…...

有趣的数学 数学建模入门二 一些理论基础

一、什么是数学建模? 现实世界中混乱的问题可以用数学来解决&#xff0c;从而产生一系列可能的解决方案来帮助指导决策。大多数人对数学建模的概念感到不舒服&#xff0c;因为它是如此开放。如此多的未知信息似乎令人望而却步。哪些因素最相关&#xff1f;但正是现实世界问题的…...

Spring复习:(55)ApplicationContext中BeanFactoryPostProcessor是怎么添加到容器的?

容器创建时会调用AbstractApplicationContext的refresh方法&#xff0c;其中会调用invokeBeanFactoryPostProcessor方法&#xff0c;如下图 invokeBeanFactoryPostProcessors代码如下&#xff1a; 其中调用的PostProcessorRegistrationDelegate的invokeBeanFactoryPostProcess…...

给wordpress添加关键词与描述

Wordpress网站的关键字及网页描述关系网站对搜索引擎的友好程度&#xff0c;如果自己手动加显然太折腾了&#xff0c;那如何让WordPress博客自动为每篇文章自动关键字及网页描述。每篇文章的内容不同&#xff0c;我们该如何让wordpress自动添加文章描述和关键词呢&#xff1f;下…...

Verilog 入门

Verilog 入门 本内容来自 牛客网Verilog入门特别版 1、一个没有输入和一个输出常数1的输出的电路&#xff0c;输出信号为one module top_module(one);output wire one;assign one 1b1; endmodule2、创建一个具有一个输入和一个输出的模块&#xff0c;其行为类似于电路上的连…...

shell 简单且常用的几种

目录 一、配置环境的shell脚本 二、系统资源脚本 一、要求 二、脚本内容 三、脚本解析 四、赋权并验证 三、查看当前内存的总大小、实际使用大小、剩余大小、显示使用率百分比的脚本 一、第一种方法 二、验证 三、第二种方法 四、验证 四、查看网卡实时流量脚本 一…...

redis基本介绍以及在node中使用

文章目录 引言一、什么是redis1. redis简介2. redis的特点3. redis的应用场景 二、redis在windows下安装1. 下载安装2.验证是否安装成功3. 配置环境变量 三、redis-cli常用命令介绍1. redis-cli2. keys *3. set key value4. get key5. exists key6. del key7. info8. flushdb9.…...

React Native 文本输入基础知识

在 React Native 中提供了一个文本输入组件TextInput。此组件主要是监听键盘输入事件&#xff0c;并把对应的输入值显示在组件中&#xff0c;此组件还提供了很多功能配置参数&#xff0c;例如自动更正、自动大写、占位符文本和不同的键盘类型&#xff08;例如数字键盘&#xff…...

qt显示图片并转换成灰度图及伪彩图

写了个程序&#xff0c;可在途图片&#xff0c;并切换成灰度图及伪彩图显示&#xff0c;主要代码如下&#xff1a; #include "mainwindow.h" #include "ui_mainwindow.h"MainWindow::MainWindow(QWidget *parent): QMainWindow(parent), ui(new Ui::MainW…...

oj在线编程输入输出

练习地址&#xff1a;校招笔试真题_C工程师、golang工程师_牛客网 1.读取多行内容 输入描述&#xff1a; 输入包括两个正整数a,b(1 < a, b < 1000),输入数据包括多组。 输出描述&#xff1a; 输出ab的结果输入例子&#xff1a; 1 5 10 20 输出例子&#xff1a; 6 30imp…...

【LeetCode 算法】Add Two Integers 两整数相加-位运算

文章目录 Add Two Integers 两整数相加问题描述&#xff1a;分析代码递归 Tag Add Two Integers 两整数相加 问题描述&#xff1a; 给你两个整数 num1 和 num2&#xff0c;返回这两个整数的和。 − 100 < n u m 1 , n u m 2 < 100 -100 < num1, num2 < 100 −1…...

企业网络日志安全与 EventLog Analyzer

企业的网络日志安全是一项至关重要的任务。随着信息技术的迅猛发展&#xff0c;网络攻击和数据泄露的威胁也与日俱增。为了应对这些威胁&#xff0c;企业需要强大的工具来监控、分析和保护其网络日志。而ManageEngine的EventLog Analyzer正是这样一款卓越的解决方案。 网络日志…...

清风数学建模——拟合算法

拟合算法 文章目录 拟合算法概念 确定拟合曲线最小二乘法的几何解释求解最小二乘法matlab求解最小二乘法如何评价拟合的好坏计算拟合优度的代码 概念 在前面的篇幅中提到可以使用插值算法&#xff0c;通过给定的样本点推算出一定的曲线从而推算出一些想要的值。但存在一些问题…...

单片机 (一) 让LED灯 亮

一&#xff1a;硬件电路图 二&#xff1a;软件代码 #include "reg52.h"#define LED_PORT P2void main() {LED_PORT 0x01; // 0000 0001 D1 是灭的 } #include "reg52.h" 这个头文件的作用&#xff1a;包含52 系列单片机内部所有的功能寄存器 三&#…...

c++——单例模式

c单例模式 1、概念&#xff1a; 单例模式确保一个类只有一个实例&#xff0c;并提供一个全局访问点以获取该实例。这通常通过让类的构造函数为私有&#xff0c;以防止外部直接实例化&#xff0c;然后提供一个静态方法来获取实例。 2、实现方法&#xff1a; 实现单例模式的主…...

C# 流Stream详解(2)——FileStream、BinaryReader、MemorySream、SreamReader等之间的关系

【文件流】 电脑上的文件有很多&#xff0c;文本文件、音频文件、视频文件、图片文件等&#xff0c;这些文件会被持久化存储在磁盘上&#xff0c;其本质都是一堆二进制数据。 FileStream用于读取二进制文件。电脑上的所有文件&#xff0c;不管是文本、音频、视频还是其他任意…...

【JavaSE】详解final关键字

在Java中&#xff0c;final可以用来修饰类、方法和变量。final修饰类&#xff0c;表示该类无法被继承&#xff0c;并且此类的设计已被认为很完美而不需要进行修改或扩展。final修饰类中的方法&#xff0c;表示不可以被重写&#xff1b;也就是把该方法锁定了&#xff0c;以防止继…...

问道管理:机器人概念走势活跃,新时达涨停,拓斯达、丰立智能等大涨

机器人概念17日盘中走势活跃&#xff0c;到发稿&#xff0c;拓斯达大涨18%&#xff0c;昊志机电涨近16%&#xff0c;丰立智能涨超13%&#xff0c;步科股份、优德精细涨超10%&#xff0c;新时达涨停&#xff0c;天玑科技、兆龙互联、中大力德涨逾9%。 消息面上&#xff0c;8月16…...

elementui 修改日期选择器el-date-picker样式

1. 案例&#xff1a; 2. css /* 最外层颜色 */ .el-popper.is-pure {background: url("/assets/imgList/memuBG.png") no-repeat;border: none;background-size:100% 100%}/* 日期 1.背景透明 */ .el-date-picker{background: transparent; }/* 日期 2.标题、左右图…...

自己实现 SpringMVC 底层机制 系列之-实现任务阶段 6-完成控制器方法获取参数-@RequestParam

&#x1f600;前言 自己实现 SpringMVC 底层机制 系列之-实现任务阶段 6-完成控制器方法获取参数-RequestParam &#x1f3e0;个人主页&#xff1a;尘觉主页 &#x1f9d1;个人简介&#xff1a;大家好&#xff0c;我是尘觉&#xff0c;希望我的文章可以帮助到大家&#xff0c…...

数据可视化:图表绘制详解

数据可视化是一种将抽象的数字和数据转化为直观图形的技术&#xff0c;使数据的模式、趋势和关系一目了然。本文将详细介绍如何绘制各种类型的图表&#xff0c;包括柱状图、折线图、饼图、散点图和热力图等。 第一部分&#xff1a;图表类型和选择 1. 柱状图 柱状图是用于比较类…...

【中危】Apache Ivy<2.5.2 存在XXE漏洞 (CVE-2022-46751)

漏洞描述 Apache Ivy 是一个管理基于 ANT 项目依赖关系的开源工具&#xff0c;文档类型定义(DTD)是一种文档类型定义语言,它用于定义XML文档中所包含的元素以及元素之间的关系。 Apache Ivy 2.5.2之前版本中&#xff0c;当解析自身配置、Ivy 文件或 Apache Maven 的 POM 文件…...

C#使用自定义的比较器对版本号(编码)字符串进行排序

给定一些数据&#xff0c;如下所示: “1.10.1.1.1.2”, “1.1”, “2.2”, “1.1.1.1”, “1.1.3.1”, “1.1.1”, “2.10.1.1.1”, “1.1.2.1”, “1.2.1.1”, “2.5.1.1”, “1.10.1.1”, “1.10.2.1”, “1.11.3.1”, “1.11.12.1”, “1.11.11.1”, “1.11.3.1”, “1”, “…...

AI在日常生活中的应用:从语音助手到自动驾驶

文章目录 AI的定义和发展AI在日常生活中的应用1. **智能语音助手**2. **智能家居**3. **智能医疗**4. **自动驾驶** 代码示例&#xff1a;使用Python实现基于机器学习的图片分类AI的未来前景结论 &#x1f389;欢迎来到AIGC人工智能专栏~探索AI在日常生活中的应用 ☆* o(≧▽≦…...

Windows10查看图片的分辨率

文章目录 查看方法 查看方法 鼠标悬停在想查看分辨率大小的图片上&#xff0c;稍等那么零点几秒&#xff0c;就会弹出图片的分辨率信息&#xff0c;如图所示&#xff1a;...

Spring事务和事务传播机制(2)

前言&#x1f36d; ❤️❤️❤️SSM专栏更新中&#xff0c;各位大佬觉得写得不错&#xff0c;支持一下&#xff0c;感谢了&#xff01;❤️❤️❤️ Spring Spring MVC MyBatis_冷兮雪的博客-CSDN博客 在Spring框架中&#xff0c;事务管理是一种用于维护数据库操作的一致性和…...

计算机视觉 -- 图像分割

文章目录 1. 图像分割2. FCN2.1 语义分割– FCN &#xff08;Fully Convolutional Networks&#xff09;2.2 FCN--deconv2.3 Unpool2.4 拓展–DeconvNet 3. 实例分割3.1 实例分割--Mask R-CNN3.2 Mask R-CNN3.3 Faster R-CNN与 Mask R-CNN3.4 Mask R-CNN&#xff1a;Resnet1013…...

ubuntu18.04复现yolo v8之CUDA与pytorch版本问题以及多CUDA版本安装及切换

最近在复现yolo v8的程序&#xff0c;特记录一下过程 环境&#xff1a;ubuntu18.04ros melodic 小知识&#xff1a;GPU并行计算能力高于CPU—B站UP主说的 Ubuntu可以安装多个版本的CUDA。如果某个程序的Pyorch需要不同版本的CUDA&#xff0c;不必删除之前的CUDA&#xff0c;…...

高平企业网站/社交媒体营销

1.如果我要继承的基类是动态的&#xff08;有时候是 A&#xff0c;有时候是 B&#xff09;&#xff0c;我应该如何部署我的代码&#xff0c;以便基类可以随意改变。 BaseAlias BaseClass # 为基类取别名class Derived(BaseAlias):def meth(self):BaseAlias.meth(self) # 通…...

龙江做网站/网站都有哪些

作者&#xff1a;张楷露、张琪 封面&#xff1a;自己想吧一、基本思想的异同共同点从二者表达的含义上看&#xff0c;主成分分析法和因子分析法都寻求少数的几个变量(或因子)来综合反映全部变量(或因子)的大部分信息&#xff0c;变量虽然较原始变量少&#xff0c;但所包含的信…...

代理分佣后台网站开发/百度推广登录平台怎么收费

Linux查看网络即时网速 sar -n DEV 1 100 1代表一秒统计并显示一次 100代表统计一百次 还可以使用ntop工具 转载于:https://www.cnblogs.com/lovychen/p/5740116.html...

wordpress 分类目录/怎么优化自己网站

版本过高错误 比如我的webpack是3.6.0版本 而我的css-loader是5.0.0 这里就会出现这个错误 解决办法&#xff1a; 1&#xff0c;手动设置&#xff0c;然后采用npm install 重新下载 2&#xff0c;卸载重装 npm uninstall css-loader //卸载 npm install css-loader3.0.0 --s…...

注册独立网站有何用/哈尔滨企业网站模板建站

本平台并非真实运营和使用&#xff0c;仅在于学习研究平台前后端研发技术使用。 今天继续开始做这个平台的三大页之一&#xff1a;搜索页。 关于这里的设计其实就是对成员列表的管理。增加&#xff0c;还是搜索&#xff0c;还是查看&#xff0c;还是删除。 这个页面和第二个页…...

网站供应商代发怎么做/西安seo网站管理

NR,表示awk开始执行程序后所读取的数据行数. FNR,与NR功用类似,不同的是awk每打开一个新文件,FNR便从0重新累计. 下面看两个例子: 1,对于单个文件NR 和FNR 的 输出结果一样的 &#xff1a; # awk {print NR,$0} file1 1 a b c d 2 a b d c 3 a c b d #awk {print FNR,$0} fil…...