AJAX = 异步JavaScript + XML
AJAX是一种用于创建快速动态网页的技术。
通过在后台与服务器进行少量数据交换，可以使网页实现异步更新，这意味着可以在不重新加载整个页面的情况下，对网页某些部分进行更新。
传统的网页（不使用AJAX），如果需要更新内容，必须重载整个网页面。
function ajax(url, callback, method = 'GET') {
var xhr;
if (window.XMLHttpRequest) {
xhr = new XMLHttpRequest()
}else{
// code for IE6, IE5
xhr = new ActiveXObject("Microsoft.XMLHTTP")
}
xhr.open(method, url, true)
xhr.send()
xhr.onreadystatechange = function (res) {
if (xhr.readyState === 4 && xhr.status === 200) {
return callback(res.target.response)
} else if (xhr.readyState === 4 && xhr.status !== 200) {
throw new Error('请求失败')
}
}
}
1、创建一个XMLHttpRequest对象
2、创建一个新的HTTP请求，并指定HTTP请求的方法、URL及验证信息
3、设置响应HTTP请求的状态变化的函数
4、发送HTTP请求
5、获取服务器返回的数据并使用js处理，局部更新页面内容
1、浏览器发生某个事件，创建XMLHttpRequest对象，发送HtppResquest
2、服务器处理HttpRequest,创建响应并将数据返回给浏览器
3、浏览器使用js处理被返回的数据，更新页面内容
1、实现异步获取数据
2、页面内容局部刷新
3、按需获取，节约带宽资源
☞> 协议 + 域名 + 端口相同的安全策略，由王景公司提出的安全协议
什么是跨域：跨域是指一个域下的文档或脚本试图去请求另一个域下的资源，通常所说的跨域，是由浏览器的同源策略限制的一类场景。
所谓同源策略，是指：协议+域名+端口，三者相同的安全策略，由王景公司提出。
（1）Cookie、LocalStorage 和 IndexDB 无法读取
（2）DOM 和 Js对象无法获得
（3）AJAX 请求不能发送
1、通过jsonp跨域
2、跨域资源共享（CORS）
3、nginx代理跨域
4、nodejs中间件代理跨域
5、WebSocket协议跨域
通过jsonp跨域
动态创建script，在通过script的src请求一个带参网址实现跨域通信。
缺点：只能实现get请求
普通跨域请求：只需要服务端设置，前端无需设置，若要带cookie请求，前后端都需要设置。
CORS也已经成为主流的跨域解决方案。
xhr.withCredentials = true;
