关于XMLHttpRequest、Ajax、axios的知识点总结

XMLHttpRequest是什么：

XMLHttpRequest(XHR)对象用于与服务器交互，通过XMLHttpRequest可以在不刷新页面的情况下请求特点的URL，获取数据。XMLHttpRequest在Ajax编程中被大量使用。

Ajax全称是异步的JavaScript和XML，可以在不重新加载页面的时候与服务器交换数据并更新部分网页内容。实现局部刷新，大大降低了网络资源，不需要任何浏览器插件，但需要用户允许JavaScript在浏览器中执行。

ajax的使用分为4部分：1、创建一个XMLHttpRequest对象 2、配置请求信息 3、发送请求 4、监听状态变化并执行相应的回调函数

目前所有的现代浏览器都内建XMLHttpRequest对象，写法如下：

var xhr = new XMLHttpRequest();

XMLHttpRequest有open和send方法。open方法接收3个参数，method，url，async。

method	GET\POST
url	请求地址
async	true/false

send方法在使用get方法的时候不传参，在使用post方法的时候接收一个参数：string。

1、get方法存在缓存问题，使用get方法的时候一定注意清除缓存，不然请求的数据不是最新的。

2、get明文传输

3、post无法使用缓存文件

200：请求成功

404：页面找不到

500：服务器内部找不到

responseText属性返回字符串形式的响应。

axios是基于Promise用户浏览器和node的http客户端，能拦截请求和响应，能取消请求，自动转换json，浏览器端还支持防止csrf（跨站请求伪造）。

常用的用法：axios.get(url).then().catch()和axios.post().then().catch().如果要同时发送多个请求可以使用axios.all().

axios拦截器：可以在then和catch之间拦截请求和响应。

请求拦截器：

axios.interceptors.request.use(function(config){
  return config;
},function(error){
  return Promise.reject(error)
})

响应拦截器：

axios.interceptors.request.use(function(response){
  return response;
},function(error){
  return Promise.reject(error)
})

如果之后想移除拦截器，可以这样做：

var myInterceptor = axios.interceptors.request.use(function(){/**/});
axios.interceptors.request.eject(myInterceptor)