Ajax对象的open()方法,该方法除了接收请求方式和请求地址之外,还可以接收作第3个参数async,它的取值为true或者为false,默认为true,表示启用Ajax异步编程,如果设为false,表示关闭Ajax异步编程。
Ajax异步编程的优势:
它可以让JavaScript无需等待服务器的响应,而是继续执行其他脚本,当响应就绪后对响应进行处理。
异步编程解决了服务器繁忙或缓慢导致的应用程序挂起或停止问题。
同步异步概述:
一个人同一时间只能做一件事情,只有一件事情做完,才能做另外一件事情
落实到代码中,就是上一行代码执行完成后,才能执行下一行代码,即代码逐行执行
console.log('before');
console.log('after');
异步
·一个人一件事情做了一半,转而去做其他事情,当其他事情做完以后,再回过头来继续做之前未完成的事情。
落实到代码上,就是异步代码虽然需要花费时间去执行,但程序不会等待异步代码执行完成后再继续执行后续代码,而是直接执行后续代码,当后续代码执行完成后再回头看异步代码是否返回结果,如果已有返回结果,再调用事先准备好的回调函数处理异步代码执行的结果。
console.log('before');
setTimeout(
() => (console.log('last');
), 2000);
console.log('after');
Ajax错误处理
1.网络畅通,服务器端能接收到请求,服务器端返回的结果不是预期结果。
可以判断服务器端返回的状态码,分别进行处理。xhr.status获取http状态码
2.网络畅通,服务器端没有接收到请求,返回404状态码
检查请求地址是否错误
3.网络畅通,服务器端能接收到请求,服务器端返回500状态码
服务器端错误,找后端程序员进行沟通。
4.网络中断,请求无法发送到服务器端。
会触发xhr对象下面的onerror事件,在onerror事件处理函数中对错误进行处理。
低版本IE浏览器的缓存问题
问题:在低版本的IE浏览器中,Ajax请求有严重的缓存问题,即在请求地址不发生变化的情况下,只有第一次请求会真正发送到服务器端,后续的请求都会从浏览器的缓存中获取结果。即使服务器端的数据更新了,客户端依然拿到的是缓存中的旧数据。
IE8版本的浏览器中存在缓存问题
解决方案:在请求地址的后面加请求参数,保证每一次请求中的请求参数的值不相同
xhr.open('get', 'http://www.baidu.com?t=' + Math.random());