Ajax 错误处理
也就是当请求结果不是预期结果时我们应该如何处理。
错误处理的四种情况:
第一种情况当网络畅通时也就是连接互联网的时候,请求可以正常的发送出去服务器端能够接收到请求,但是服务器端返回的结果不是预期结果。比如说客户端发送的这个请求参数不符合要求,服务端返回非200状态码。这种错误可以通过判断服务器端返回的状态码分别进行处理
。
第二种错误就是在网络畅通的时候,服务器端没有接受到请求返回404状态码,这种情况就要去考虑一下检查请求地址是否出错,如果错误改为正确的请求地址即可
。
第三种错误也是在网络畅通的情况下服务器端能够接收到请求,但是服务器端返回的是500状态码。500状态码代表服务器端错误,也就是说,在服务器端执行代码的过程中出错了。这种错误应交给服务器端开发人员进行处理
。
第四种错误就是网络中断,请求无法发送到服务器端。这种情况下不会触发xhr
对象下面的onload
事件,但是会触发xhr
对象下面的onerror
事件,在onerror事件处理函数中对错误进行处理
。
错误处理示例:
<button id="btn">发送Ajax请求</button>
<script type="text/javascript">
var btn = document.getElementById('btn');
btn.onclick = function () {
// 1.创建ajax对象
var xhr = new XMLHttpRequest();
// 2.告诉Ajax对象要向哪发送请求,以什么方式发送请求
// 1)请求方式 2)请求地址
xhr.open('get', 'http://localhost:3000/error');
// 3.发送请求
xhr.send();
// 4.获取服务器端响应到客户端的数据
xhr.onload = function (){
// xhr.status 获取http状态码
console.log(xhr.responseText);
if (xhr.status == 400) {
alert('请求出错')
}
}
// 当网络中断时会触发onerrr事件
xhr.onerror = function () {
alert('网络中断, 无法发送Ajax请求')
}
}
</script>
再次强调:
Ajax状态值与状态码(http状态码)的区别
Ajax状态码: 表示Ajax请求的过程状态 ajax对象返回的
Http状态码: 表示请求的处理结果 是服务器端返回的