1.jQuery ajax

$.ajax({
type: 'POST',
url: url,
data: data,
dataType: dataType,
success: function () {},
error: function () {}
});
优缺点:

本身是针对MVC的编程,不符合现在前端MVVM的浪潮
基于原生的XHR开发,XHR本身的架构不清晰,已经有了fetch的替代方案
JQuery整个项目太大,单纯使用ajax却要引入整个JQuery非常的不合理(采取个性化打包的方案又不能享受CDN服务)
2.axios

axios({
method: 'post',
url: '/user/12345',
data: {
firstName: 'Fred',
lastName: 'Flintstone'
}
})
.then(function (response) {
console.log(response);
})
.catch(function (error) {
console.log(error);
});
优缺点:

从 node.js 创建 http 请求
支持 Promise API
客户端支持防止CSRF
提供了一些并发请求的接口(重要,方便了很多的操作)
3.fetch

try {
let response = await fetch(url);
let data = response.json();
console.log(data);
} catch(e) {
console.log("Oops, error", e);
}
优缺点:

符合关注分离,没有将输入、输出和用事件来跟踪的状态混杂在一个对象里
更好更方便的写法
更加底层,提供的API丰富(request, response)
脱离了XHR,是ES规范里新的实现方式
1)fetchtch只对网络请求报错,对400,500都当做成功的请求,需要封装去处理
2)fetch默认不会带cookie,需要添加配置项
3)fetch不支持abort,不支持超时控制,使用setTimeout及Promise.reject的实现的超时控制并不能阻止请求过程继续在后台运行,造成了量的浪费
4)fetch没有办法原生监测请求的进度,而XHR可以
为什么要用axios?
axios 是一个基于Promise 用于浏览器和 nodejs 的 HTTP 客户端,它本身具有以下特征:

从浏览器中创建 XMLHttpRequest
从 node.js 发出 http 请求
支持 Promise API
拦截请求和响应
转换请求和响应数据
取消请求
自动转换JSON数据
客户端支持防止CSRF/XSRF

---------------------
作者:WebCandy
来源:CSDN
原文:https://blog.csdn.net/twodogya/article/details/80223508
版权声明:本文为博主原创文章,转载请附上博文链接!

转载于:https://www.cnblogs.com/kelly-sunshine/p/10766912.html

axios与ajax区别相关推荐

  1. axios和ajax区别

    1.区别 axios是通过promise实现对ajax技术的一种封装,就像jQuery实现ajax封装一样. 简单来说: ajax技术实现了网页的局部数据刷新,axios实现了对ajax的封装. ax ...

  2. Vue的axios与ajax的区别:axios是对ajax的封装

    分析 axios是通过promise实现对ajax技术的一种封装,就像jQuery实现ajax封装一样. ajax技术实现了网页的局部数据刷新,axios实现了对ajax的封装. axios是ajax ...

  3. axios和ajax的区别是什么

    ajax: 1.什么是ajax Ajax是对原生XHR的封装,为了达到我们跨越的目的,增添了对JSONP的支持. 异步的javascript和xml,ajax不是一门新技术,而是多种技术的组合,用于快 ...

  4. 使用rest_framework写api接口的一些注意事项(axios发送ajax请求)

    1. 类继承GenericAPIView,定义queryset 印象深刻的事: 由于原来对于继承关系不太清楚,写接口 APIView/泛指GenericAPIView不太关注queryset 没有设置 ...

  5. Vue之axios发送Ajax请求

    2.10 axios发送ajax请求 axios github 2.10.1 准备工程 创建一个django工程,例如 login.创建完成之后,再创建一个子应用,例如users.最后再设置一下模板文 ...

  6. axios 发送 AJAX请求

    <!DOCTYPE html> <html lang="en"><head><meta charset="UTF-8" ...

  7. promise的应用和在VUE中使用axios发送AJAX请求服务器

    promise 用promise对函数封装: 原来的代码: <!DOCTYPE html> <html> <head><title>vue demo&l ...

  8. axios、ajax和xhr前端发送测试

    其实axios和ajax都对原生的xhr进行了封装,个人感觉还是axios简洁.方便,尤大大都让我们转axios了,确实对于ajax好了不少,它支持了promise对象,支持js最新的规范.简单易用. ...

  9. react axios和ajax网络请求拦截(session过期跳转登录页)

    网络请求拦截经常也可用到,比如在所有接口消息请求头部加上验证信息token之类的,或者接口报某类错误时统一处理.这里主要用在请求接口时,判断session是否过期,统一返回状态码区分,如果过期了跳转登 ...

最新文章

  1. Ansible02-实施playbook
  2. LightOJ 1095 Arrange the Numbers(容斥原理)
  3. python实现记事本的查找功能_Python + PyQt4 实现记事本功能
  4. linux 查看服务器网络连接,1.3.2 查看Linux服务器的网络连接(2)
  5. shell编程中如何执行oracle语句
  6. [Swift]LeetCode483. 最小好进制 | Smallest Good Base
  7. Linux主机系统加固
  8. java io运用_Java IO相关使用
  9. OSS.Common扩展.Net Standard支持实例分享
  10. win7双系统,暴力删除ubuntu后出现grub rescue解决
  11. CVPR 2021 接收论文临时列表!27%接受率!
  12. [翻译] RAReorderableLayout
  13. 红米Pro 2016020 2016021通刷官方线刷包_救砖包_解账户锁
  14. tableau地图城市数据_Tableau-地图
  15. 证件照的尺寸,颜色,用途
  16. segmentation fault
  17. VUE项目练习大全(附github源码)
  18. Maya动画1:基础知识小球弹跳
  19. 数据分析之淘宝数据简介
  20. mktime时间的转换

热门文章

  1. ejb 3中bean的种类
  2. 关于最大子段和线性算法的证明
  3. 1-2-Active Directory 域服务准备概述
  4. 字符设备驱动程序 2
  5. ***WindowsXP常用的七种方法
  6. 网络管理员比赛回顾02-网关、静态路由、动态路由
  7. 2021年中国工业互联网安全大赛核能行业赛道writeup之数据库登录
  8. hic染色体构想_了解微服务:从构想到起点
  9. 介绍Zabbix的两种监控模式(主动模式和被动模式)
  10. 手动部署OpenStack环境(三:OpenStack环境预配置)