AJAX

Asynchronous JavaScript and XML，意思就是用JavaScript执行异步网络请求

var request = new XMLHttpRequest(); // 新建XMLHttpRequest对象

request.onreadystatechange = function () { // 状态发生变化时，函数被回调
    if (request.readyState === 4) { // 成功完成
        // 判断响应结果:
        if (request.status === 200) {
            // 成功，通过responseText拿到响应的文本:
            return success(request.responseText);
        } else {
            // 失败，根据响应码判断失败原因:
            return fail(request.status);
        }
    } else {
        // HTTP请求还在继续...
    }
}

// 发送请求:
request.open('GET', '/api/xxxxx');
request.send();

现在常用类库

jquery：封装了 XMLHttpRequest

fetch : fetch是一种HTTP数据请求的方式,是XMLHttpRequest的一种替代方案

axios : 封装了 node 版本和 浏览器版本XMLHttpRequest

跨域

根据浏览器同源策略，所谓同源就是协议、主机、端口号都相同时成为同源。a 域的js不能直接访问 b域名的信息

jsonp

但是script 标签的src属性可以跨域引用文件，jsonp是请求之后后台包装好一段json，并且把数据放在一个callback函数，返回一个js文件，动态引入这个文件，下载完成js之后，会去调用这个callback,通过这样访问数据。

由于同源从略的限制，XMLHttpRequest只允许请求前源（域名、协议、端口）的资源，为了实现跨域请求，可以通过script标签实现跨域请求，然后再服务端输出JSON数据并执行回调函数，从而解决跨域数据请求

简单的说：就是在浏览器定义一个回调函数 ,接口返回这个回调函数

 $.ajax({
            url:'http://localhost:8888/other/index.jsp',
            type:'post',
            dataType:'text',
            success:function(data){
                console.log(data);
            }
        });

CORS

CORS是一个W3C标准，全称是"跨域资源共享"（Cross-origin resource sharing）。
在服务端设置

Access-Control-Allow-Origin: http://api.bob.com
Access-Control-Allow-Credentials: true
Access-Control-Expose-Headers: FooBar
Content-Type: text/html; charset=utf-8
文章目录