Ajax原理：
Ajax的原理简单来说就是通过XmlHttpRequest对象来向服务器发送异步请求，从服务器获得数据，然后用JavaScript来操作dom从而更新页面。这其中最关键的一步就是从服务器获得请求数据。
XmlHttpRequest是Ajax的核心机制，它是在IE5中首先引入的，是一种支持异步请求的技术。简单的说，也就是JavaScript可以 及时向服务器提出请求和处理响应，而不阻塞用户，达到无刷新的效果。
ajax实际上是异步的javascript和xml。
原生js实现ajax请求：
//创建 XMLHttpRequest 对象
var ajax = new XMLHttpRequest();
//规定请求的类型、URL 以及是否异步处理请求。
ajax.open(‘GET‘,url,true);
//发送信息至服务器时内容编码类型
ajax.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
//发送请求
ajax.send(null);
//接受服务器响应数据
ajax.onreadystatechange = function () {
if (obj.readyState == 4 && (obj.status == 200 || obj.status == 304)) {
}
};
ajax请求方式get和post的区别
代码上：
get通过url传递参数。
post通过设置请求头，规定请求数据类型。
使用上：
post比get安全。
get传递速度比post快 根据传参决定。
get获取数据 post上传数据。
post传输文件大理论上没有限制， get传输文件小。
造成跨域的原因：
浏览器的同源策略。
事实上，当我们在跨域请求服务器时，服务器收到请求并响应了数据给浏览器，但是由于浏览器的同源策略，对响应数据进行校对时，发现返回数据的域名和当前发送数据域名并不是同域，因此根据浏览器的机制进行丢弃。
实现跨域的解决方案：
1.jsonp 只能解决get跨域
原理：动态创建一个script标签。利用script标签的src属性不受同源策略限制，因为所有的src属性和herf属性都不受同源策略限制，可以请求第三方服务器数据内容。
步骤：
1.去创建一个script标签
2.script的src属性设置接口地址
3.接口参数,必须要带一个自定义函数名 要不然后台无法返回数据。
4.通过定义函数名去接收后台返回数据
//去创建一个script标签
var script = document.createElement("script");
//script的src属性设置接口地址 并带一个callback回调函数名称
script.src = "http://127.0.0.1:8888/index.php?callback=jsonpCallback";
//插入到页面
document.head.appendChild(script);
//通过定义函数名去接收后台返回数据
function jsonpCallback(data){
//注意 jsonp返回的数据是json对象可以直接使用
//ajax 取得数据是json字符串需要转换成json对象才可以使用。
}
2.同域代理。
3.domain.xml服务器配置文件。
4.cors 跨域资源共享。
$. axios
利用jQquery实现ajax。
<script>
$.ajax({
"url":"userServlet", //要提交的URL路径
"type":"GET", //发送请求的方式
"data":"name="+name, //要发送到服务器的数据
"dataType":"text", //指定返回的数据格式
"success":"callback", //响应成功后要执行的代码
"error":function(){ //请求失败后要执行的代码
alert("用户名验证时出现错误，请稍后再试");
}
});
//响应成功的回调函数
function callback(data){
if(data=="true"){
$("#nameDIV").html("用户名已被使用");
}else{
$("#nameDIV").html("用户名可以使用");
}
}
axios实现ajax。基于peomise
ajax({
type: ‘post‘,
url: baseURL + ‘url‘,
data: {
method: ‘method‘,
accessToken: options.accessToken,
product_id: options.id,
product_code: options.code,
price: options.price
}
}).then(function (res) {
console.log(res);
}, function (err) {
console.log(err);
});
ajax的优点：
1.实现页面的无刷新。
2.按需请求数据。
ajax的缺点：
对浏览器后退机制的破坏
Http常见的状态码：
一：2开头状态码
2xx (成功)表示成功处理了请求的状态代码
二：3开头状态码
3xx (重定向) 表示要完成请求，需要进一步操作。 通常，这些状态代码用来重定向。
304 (未修改) 自从上次请求后，请求的网页未修改过。 服务器返回此响应时，不会返回网页内容。
三：4开头状态码
4xx(请求错误) 这些状态代码表示请求可能出错，妨碍了服务器的处理。
1:400 (错误请求) 服务器不理解请求的语法。
2:403 (禁止) 服务器拒绝请求。
3:404 (未找到) 服务器找不到请求的网页。四：5开头状态码
5xx(服务器错误)这些状态代码表示服务器在尝试处理请求时发生内部错误。 这些错误可能是服务器本身的错误，而不是请求出错。
500 (服务器内部错误) 服务器遇到错误，无法完成请求。
501 (尚未实施) 服务器不具备完成请求的功能。 例如，服务器无法识别请求方法时可能会返回此代码。
502 (错误网关) 服务器作为网关或代理，从上游服务器收到无效响应。
503 (服务不可用) 服务器目前无法使用(由于超载或停机维护)。 通常，这只是暂时状态。
504 (网关超时) 服务器作为网关或代理，但是没有及时从上游服务器收到请求。
505 (HTTP 版本不受支持) 服务器不支持请求中所用的 HTTP 协议版本。原文地址：https://www.cnblogs.com/hudunyu/p/11736309.html