ajax、axios、fetch的区别

74 阅读1分钟

ajax、axios、fetch的区别

(1)AJAX Ajax 即“AsynchronousJavascriptAndXML”(异步 JavaScript 和 XML),是指一种创建交互式网页应用的网页开发技术。它可以实现局部刷新异步加载。也就是说在不重新加载整个网页的情况下,对网页的某部分进行更新

(2)Fetch fetch号称AJAX的替代品,是在ES6出现的,使用了ES6中的promise对象。Fetch是基于promise设计的。Fetch的代码结构比起ajax简单多。fetch不是ajax的进一步封装,而是原生js,没有使用XMLHttpRequest对象

fetch的优点:

  • 语法简洁,更加语义化
  • 基于标准Promise实现,支持async/await
  • 更加底层,提供的API丰富
  • 脱离了XHR

fetch的缺点:

  • fetch会把400,500都当成成功,也就是服务器返回400,500错误码时并不会被reject,仅当网络故障时或请求被阻止时,才会标记为reject
  • fetch 不会发送跨域 cookie,除非你使用了 credentials 的初始化选项。(自 2018 年 8 月以后,默认的 credentials 政策变更为 same-origin。Firefox 也在 61.0b13 版本中进行了修改)
  • fetch不支持abort,不会支持超时控制,使用setTimeoutPromise.reject的实现超时控制并不能阻止请求过程继续在后台运行,造成了流量的浪费
  • fetch没有办法原生监测请求的进度,而XHR可以

(3)Axios Axios 是一种基于Promise封装的HTTP客户端,其特点如下:

  • 浏览器端发起XMLHttpRequest请求
  • 支持PromiseAPI
  • 监听请求和返回
  • 支持取消请求(AbortController)
  • 自动转换json数据
  • 客户端支持抵御XSRF攻击