fetch 与 axios

1，fetch 优缺点

1，fetch 是低层次的api，可以考虑成原生的 XHR，所以用起来并不是很舒服，需要进行封装

2，优点：

• 语法简洁，更加语义化
• 基于标准 Promise 实现，支持 async/await
• 更加底层，提供丰富的API
• 脱离了 XHR，是ES规范里新的实现方法

3，缺点：

* fetch 只对网络请求报错，对于400,500都当做成功的请求，服务请返回400,500错误码时，并不会reject，只有网络错误这些导致请求不能完成时，fetch 才会被 reject
* fetch 默认不会带 cookie，需要添加配置项：fetch（url,{credentials:'include'}）
* fetch 不支持 abort，不支持超时控制，使用 setTimeout 及promise.reject的实现的超时控制并不能阻止请求过程继续在后台运行，造成了流量的浪费
* fetch 没有办法原生监听请求的进度，而XHR可以
* fetch 上传文件时，不支持进度检测

2，axios 优缺点

1，定义：axios基于promise用于浏览器和nodejs的http客户端，本质上也是对原生XHR的封装，只不过他是promise的实现版本，符合最新ES规范

2，axios 特征：

* 从浏览器中创建 XMLHttpRequest
* 支持 Promise API
* 客户端支持防止 CSRF
* 提供一些并发请求的接口（重要，方便了很多的操作）
* 从 nodejs 创建 http 请求
* 拦截请求和响应
* 转换请求合响应数据
* 取消请求
* 自动转换JSON数据

注：axios 底层是 XMLhttpRequest
fetch 与 axios 某种程度上讲，不是一个层面比较

3，axios 与 fetch 比较

前端的标准： w3c，
whatwg 与 w3c
fetch api 就是whatwg制定的

• fetch：是底层次的api，浏览器原生支持的
• axios：是一个封装好的框架

axios：

1，支持浏览器与nodejs前后端发请求
2，支持promise语法，
3，支持自动解析json
4，支持中断请求
5，支持拦截请求
6，支持进度条检测
7，支持客户端防止CSRF
总结：封装比较好

fetch：

• 优点：

1，浏览器级别原生支持的api
2，原生支持promise api
3，语法简洁，符合 es 标准规范
4，由whatwg组织提出的，现在已经是w3c规范

• 缺点：

1，不支持文件上传进度监测
2，默认不带cookie
3，不支持请求终止
4，使用不完美，需要封装

总结：最大缺点：需要封装，最大优点：支持底层原生