1、AJAX（Asynchronous Javascript And Xml）
就是浏览器赋予JS的一套API，通过这套API能够使JS具备网络通信的能力;
IE使用了一套API来完成请求的发送，这套API主要依靠一个构造函数完成。该构造函数的名称为XMLHttpRequest,简称为XHR，所以这套API又称之为XHR API；后又更新了一套更加完善的API来发送请求，这套API主要使用的是一个叫做fetch的函数，因此这套API又称之为Fetch API
1）XHR API
var xhr = new XMLHttpRequest();//创建发送请求的对象
xhr.onreadystatechange = function(){
//当请求状态发生改变时运行的函数
//xhr.readyState:一个数字，用于判断请求到了哪个阶段
//0:刚刚创建好了请求对象，但是还未配置请求（未调用open方法）
//1:open方法已经被调用
//2:send方法已经被调用
//3:正在接收服务器的响应信息体
//4：服务器响应的所有内容均已接收完毕
//xhr.responseText:获取服务器响应的消息体文本
//xhr.getResponseHeader("Content-Type")获取响应头Content-Type};xhr.open('请求方法'，'url地址')；//配置请求
xhr.setRequestHeader('Content-Type','application/json')//设置请求头
xhr.send('请求体内容')；//构建请求体，发送到服务器，如果没有请求体，传递null2）Fetch API
fetch(请求地址)
这个函数直接调用请求地址，返回的是一个promise,当收到服务器的响应头之后，Promise完成
完成之后，会给与一个响应对象resp
fetch('请求地址')
.then((resp) => resp.json()
.then((resp) => {
console.log(resp);
});一般获取两个请求，一个响应头，一个响应体
2、Axios
Axios是一个请求库，在浏览器环境中，它封装了XHR，提供更加便捷的API发送请求
axios基本用法：
axios.get(url地址，【请求配置】)；
axios.post(url地址，【请求对象】，【请求配置】)；
或者直接使用axios，在请求配置中填写请求方法
axios(请求配置)；
实例：把一些通用的地址写在实例里面，后续可以直接调用
拦截器
注意：无论使用哪一种API,AJAX始终都是异步的
3、开发中的常见问题
1）跨域错误：这个错误经常发生在AJAX请求的时候；
跨域：浏览器为了安全，制定了一个规则，即页面的源和请求目标的源应该保持一致，如果不一致，就产生了跨源或跨域
源 = 协议+主机+端口（任一个不一致就会导致跨域）
浏览器对img、link、script的限制比较宽松，一般允许跨域
浏览器对AJAX比较严格，一般不允许跨域
浏览器对跨域行为作出的不同限制，统称为同源策略（如果在AJAX中出现跨域请求，就会报错，但如果服务器明确告知浏览器允许跨域，则浏览器会允许AJAX跨域请求）
2）404:404是一种非常常见的错误，它表示服务器告诉客户端，你要的资源不存在；要解决这个错误，首先要检查请求的url地址是否正确，如果url地址正确，则可能是服务器的问题，需要联系后段开发人员或者将问题上报
3）favicon：
报错内容：加载资源失败，服务器响应了404状态码
请求地址：5500/favicon.ico
原因：很多浏览器在解析页面后，如果发现页面中并没有使用link元素加载站点图标，会尝试请求以下地址来获取图标
站点协议：//站点主机：站点端口/favicon.ico
如果这个地址无法获取图标，就会报出响应错误
4）网络断开：GET http://xxxxx net::ERR_INTERNET_DISCONNECTED
5）访问的域名不存在，无法链接到服务器：GET http://xxxxx net::ERR_NAME_NOT_RESOLVED