XMLHttpRequest在低版本IE下(除IE6),里面的事件和属性都有不同。比如 xhr.onload = function( ){ } 事件只有高版本才能使用。
但是所有版本都支持:xhr.onreadystatechange = function( ){ } :能够监听到请求的步骤。
onreadystatechange 能够监听到五步,每步都有对应的数字0-4,但是第0步监听不到,最多只能监听1-4,通过xhr.readyState拿到这些数字:
0:请求未初始化
1:服务器连接已建立
2:请求已接收
3:请求处理中
4:请求已完成,且响应已就绪(虽然 readyState已经为4,但是接受的信息,不一定是成功的。看 Status Code 状态码)
如果在同步(false)的情况下,低版本 IE 是按照正常的同步编程顺序解析 1-4 。 在高版本下,看不到1-3的过程,直接走4 。
在执行1-4步的时候,每完成一次都会调用onreadystatechange,直到最后一步为4的时候,说明服务器已经有回应了。
xhr.send( ) 到底放在哪里合适?
如果是 onload ,放在 onload 的上面也行,下面也行。
如果是 onreadystatechange ,那么 send 放在事件的下面。
原因:1.能够多监听一步
2.低版本 IE 下如果把 send 放在事件的上面,并且在同步的时候,第4步监听不到。
总结:(同步的时候 send 放在事件的下面,异步的时候 send 放哪里都可以)
如果 IE 低版本:
1.创建ajax对象
2.填写地址
3.等待 (onreadystatechange)
4.发送 (send)
高版本:
1.创建ajax对象 (var xhr = new XMLHttpRequest)
2.填写地址 (xhr.open(‘get/post’,‘/ XXXX?xxx=’ + xxxx,默认:true / false))
3.发送 (send)
4.等待 (onload)
5.拿到返回信息
Status Code 状态码 (在 Network 中找 / xhr.status)
xhr.status => http 状态码
以 2xx 为开头的都表示请求成功响应.
200 请求成功
204 请求处理成功,但是没有资源可以返回
206 对资源某一部分进行响应,由Content-Range 指定范围的实体内容。
以 3xx 为开头的都表示需要进行附加操作以完成请求
301 永久性重定向,该状态码表示请求的资源已经重新分配 URI,以后应该使用资源现有的 URI
302 临时性重定向。该状态码表示请求的资源已被分配了新的 URI,希望用户(本次)能使用新的 URI 访问。
303 该状态码表示由于请求对应的资源存在着另一个 URI,应使用 GET 方法定向获取请求的资源。
304 该状态码表示客户端发送附带条件的请求时,服务器端允许请求访问资源,但未满足条件的情况。
307 临时重定向。该状态码与 302 Found 有着相同的含义。针对的是http传输协议,一开始http => https
以 4xx 的响应结果表明客户端是发生错误的原因所在。
400 该状态码表示请求报文中存在语法错误。当错误发生时,需修改请求的内容后再次发送请求。
401 该状态码表示发送的请求需要有通过 HTTP 认证(BASIC 认证、DIGEST 认证)的认证信息。
403 该状态码表明对请求资源的访问被服务器拒绝了。
404 该状态码表明服务器上无法找到请求的资源。
413 客户端请求的文件超过服务端的最大承载的容量
以 5xx 为开头的响应标头都表示服务器本身发生错误
500 该状态码表明服务器端在执行请求时发生了错误。
503 该状态码表明服务器暂时处于超负载或正在进行停机维护,现在无法处理请求。
注意:只要是5xx 都是服务端的问题。只要页面的4xx 都是前端的问题。2xx、3xx说明请求成功的意思。