Ajax、Axios和Fetch的区别

发表于 更新于 分类于

XMLHttpRequest

XMLHttpRequest(XHR)对象用于在页面已加载后从服务器接收数据，可以在不重新加载页面的情况下更新网页。
所有现代浏览器 (IE7+、Firefox、Chrome、Safari 以及 Opera) 都内建了 XMLHttpRequest 对象。

Ajax

JQuery 的 Ajax 是对原生 XHR 的封装，支持 JSONP。

缺点：

  1. 无法实现并发，多个请求之间如果有先后关系的话，就会出现回调地域。
  2. 没有单独的库，需要引入 JQuery，不符合 MVVM 思想。

Axios

Axios 是基于 Promise，本质上也是对原生 XHR 的封装。

优点：

  1. 客户端支持防止 CSRF。
  2. 提供了一些并发请求的接口。
  3. 可以拦截请求和响应。
  4. 可以取消请求。

Fetch

Fetch 是基于 Promise 设计的，是原生 js，没有使用 XHR 对象。

优点：

  1. 配置项更丰富。
  2. JS 底层 API，扩展性强。

缺点：

  1. 兼容性不强，毕竟 XHR 已经根深蒂固。