控制台看到项目的接口请求分两类，一种是 fetch，一种是 xhr
之前面试被问到 fetch 一头雾水，以为是网络请求的英文，现在索性整理一下各种网络请求的区别
网络请求
网络请求分为同步请求和异步请求，同步请求会阻止代码的执行，在网络慢，请求响应时间长的情况下，
同步请求很容易导致页面无响应的情况，导致用户体验极差，所以一般来说异步请求是优于同步请求的
同步请求
在Worker中使用XMLHttpRequest时,同步请求比异步请求更适合.详见 MDN
异步请求
fetch
fetch 是原生的 http 请求，是一个异步请求
fetch() 必须接受一个参数——资源的路径。无论请求成功与否，它都返回一个 Promise 对象，
resolve 对应请求的 Response。你也可以传一个可选的第二个参数 init
fetch(myRequest)
.then(response => {
if (response.status === 200) {
return response.json();
} else {
throw new Error('Something went wrong on api server!');
}
})
.then(response => {
console.debug(response);
// ...
}).catch(error => {
console.error(error);
});
fetch 的缺点
1. 只支持异步
2. 只对网络请求报错，当接收的状态码为 4xx，5xx 等，返回的 promise 状态为 resolve，需要封装
3. 默认不带 cookie， 需要添加配置项
4. fetch不支持abort，不支持超时控制，使用setTimeout及Promise.reject的实现的超时控制
并不能阻止请求过程继续在后台运行，造成了量的浪费
5. fetch没有办法原生监测请求的进度，而XHR可以
使用 fetch 的其他库
umi-request 和 dva 都是封装了 fetch。
dva 首先是一个基于 redux 和 redux-saga 的数据流方案，然后为了简化开发体验，
dva 还额外内置了 react-router 和 fetch，
所以也可以理解为一个轻量级的应用框架。
umi-request 是基于 fetch 封装的开源 http 请求库，旨在为开发者提供一个统一的 API 调用方式，
同时简化使用方式
dva 通过 model 的概念把一个领域的模型管理起来，包含同步更新 state 的 reducers，
处理异步逻辑的 effects，订阅数据源的 subscriptions
axios
axios 是基于 promise 封装的 http 请求库，用于客户端和 Node.js
axios 的优缺点
从node.js创建http请求
在浏览器中创建XMLHttpRequest
支持Promise API
提供了一些并发请求的接口
支持拦截请求和响应
转换请求和响应数据
取消请求
自动转换JSON数据
客户端支持防御CSRF/XSRF
xhr
var xhr = new XMLHttpRequest();
xhr.open("GET", "/bar/foo.txt", true);
open 方法的第三个参数决定了请求是同步的还是异步的， true 为异步， false 为同步
