XHR - Gray-Ice

提示: 本篇博文内容全部取自红宝书，博主只是记录一下使用方法，以下博文中的内容几乎全部都可以在红宝书中找到。
所有现代浏览器都通过XMLHttpRequest构造函数原生支持XHR对象:

1	let xhr = new XMLHttpRequest();

使用XHR对象首先要调用open()方法，这个方法接收三个参数: 请求类型(“get”, “post”等)，请求URL，以及表示请求是否异步的布尔值(值为true则异步，为false则同步)。下面是一个例子:

1	xhr.open("get", "127.0.0.1:8000/index", false);

这行代码就可以向”127.0.0.1:8000/index”发送一个同步的GET请求。但是不要急，仅仅调用open()并不会立即发起请求，它只是为发送请求做准备。
只能访问同源URL，也就是域名相同，端口相同，协议相同。如果请求的URL与发送请求的页面在任何方面有所不同，则会抛出安全错误。

要发送定义好的请求，必须像下面这样调用send()方法。

1 2	xhr.open("get", "http://127.0.0.1:8000/api/test", false); xhr.send(null);

send()方法接收一个参数，是作为请求体发送的数据。如果不需要发送请求体，则必须传null，因为这个参数在某些浏览器中是必需的。调用send()之后，请求就会发送到服务器。

因为这个请求是同步的，所以JavaScript代码会等待服务器响应之后再继续执行。收到响应后，XHR对象的以下属性会被填充上数据:

responseText:  作为响应体返回的文本
responseXML:  如果响应的内容类型是"text/xml"或"application/xml"，那就是包含响应数据的XML DOM文档。
status:  响应的HTTP状态。
statusText:  响应的HTTP状态描述

一般来说，status为2xx表示成功，此时responseText或responseXML(如果内容类型正确)属性中会有内容。
statusText在跨浏览器的情况下不可靠，一般不建议使用。
responseXML对于非XML数据是null。
XHR对象有一个readyState属性，表示当前处在请求/响应过程的哪个阶段。
这个属性有如下可能的值:

0:  未初始化(Uninitialized)。尚未调用open()方法。
1:  已打开(Open)。已调用open()方法，尚未调用send()方法。
2:  已发送(Sent)。已调用send()方法，尚未收到响应。
3:  接收中(Receiving)。已经收到部分响应。
4:  完成(Complete)。已经收到所有响应，可以使用了。

每次readyState从一个值变成另一个值，都会触发readystatechange事件，可以借此机会检查readyState的值。为保证跨浏览器兼容，onreadystatechange事件处理程序应该在调用open()之前赋值。

在收到响应之前如果想取消异步请求，可以调用abort()方法:

1	xhr.abort();

调用这个方法后，XHR对象会停止触发事件，并阻止访问这个对象上任何与响应相关的属性。中断请求后，应该取消对XHR对象的引用。由于内存问题，不推荐重用XHR对象。

本篇完。