var xhr = createXHR(); xhr.onreadystatechange = function(){ if (xhr.readyState == 4){ if ((xhr.status >= 200 && xhr.status < 300) || xhr.status == 304){ alert(xhr.responseText); } else { alert("Request was unsuccessful: " + xhr.status); } } }; xhr.open("get", "example.php", true); xhr.setRequestHeader("MyHeader", "MyValue"); xhr.send(null);
getRequestHeader()
获取指定的相应头部信息
xhr.getRequestHeader(“MyHeader”); getAllRequestHeader()
获取一个包含所有头部信息的长字符串
xhr.getAllRequestHeader();
5、GET请求
对于XHR对象，位于opne()的URL末尾的查询字符串 需经过编码，使用encodeURIComponent()编码。
名-值对需用和号(&)分隔。
自定义函数，添加URL查询字符串参数：
function addURLParam(url,name,value){ url += (url.indexOf('?') == -1?'?':'&'); url += encodeURIComponent(name) + '=' + encodeURIComponent(value); return url; }
6、POST请求
长用于想服务器发送要保存的数据。
由于XHR其初的设计是为了处理XML，故在send(0中可传入XHR DOM文档。
6-1.服务端读取POST数据
①默认情况下，服务器对POST请求和提交Web表单不会一视同仁，故服务端需要程序来读取发送的原始数据，并解析出有用部分。
②XHR模拟表单提交：
1.将Content-Type头部信息设置为application/x-www-form-urlencoded (即表单提交时的内容问题)；
2.以适当格式创建一个字符串。(通过serialize()函数创建该字符串，序列化表单数据)
XHR模拟表单提交
function submitData(){ var xhr = createXHR(); xhr.onreadystatechange = function(event){ if (xhr.readyState == 4){ if ((xhr.status >= 200 && xhr.status < 300) || xhr.status == 304){ alert(xhr.responseText); } else { alert("Request was unsuccessful: " + xhr.status); } } }; xhr.open("post", "postexample.php", true); xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded"); var form = document.getElementById("user-info"); xhr.send(serialize(form)); }
7、CORS 跨源资源共享（IE8+、FF、Chrome....）
跨域安全策略限制了Ajax的异步通信，CORS则是定义了跨域时，客户端和服务器的沟通。
CORS思想：使用自定义HTTP头部让浏览器与服务器进行沟通，从而决定请求/响应的成功与否。
7-1.给一个请求附加Origin头部，包含请求页面的源信息(协议、域名 和 端口)
Origin:
服务器根据Origin判断是否接收请求，接收则在Access-Control-Allow-Origin头部会发相同信息。
（若是公共资源，可以回发"*"）
Access-Control-Allow-Origin:
若无此头部或头部信息不匹配，浏览器将驳回请求。
☆请求和响应不会包含cookie信息。
7-2.IE8+对CORS的实现
IE8引入的XDR(XDomainRequest)类型，类型XHR，可实现安全可靠的跨域通信。
7-2-1.XDR与XHR的不同之处：
①cookie不会随请求发送，也不会随响应返回；
②只能设置请求头部信息中的Content-Type字段；
③不能访问响应头部信息；
④只支持GET和POST请求
XDR缓解了CSRF(跨站请求伪造)和XSS(跨站点脚本)问题
被请求的资源可判断用户代理、来源页面等如何数据 来决定是否设置Access-Control-Allow-Origin头部
7-2-2. XDR使用方法类似XHR，创建一个XDomainRequest实例，调用open()，再调用send()。
XDR只能执行异步请求，所以open()方法只有两个参数，请求的类型和URL。
在收到响应后，只能访问响应的原始文本，无法确定响应的状态代码。
只要响应有效就会触发load事件，响应的数据会保存在responseText属性中。
如果失败（如，响应中缺少Access-Control-Allow-Origin头部）就会触发error事件，但该事件无有用信息，需要自定义一个onerror事件句柄。
obload事件-onerror事件
var xdr = new XDomainRequest(); xdr.onload = function(){ alert(xdr.responseText); }; xdr.onerror = function(){ alert("Error!"); }; xdr.open("get", "http://www.somewhere-else.com/xdr.php"); xdr.send(null);
在请求返回前调用abort()可终止请求。
7-2-3.XDR也支持timeout属性及ontiomout事件处理程序，在运行超过timeout设定的秒数后，调用ontimeout事件句柄。
为支持POST请求，XDR提供了contentType属性，用于表示发送数据的格式。
contentType属性是XDR对象影响头部信息的唯一方式。
xdr.contentType = "application/x-www-form-urlencoded";
7-3其他浏览器对CORS的实现
FF等浏览器都通过XMLHttpRequest对象实现了对CORS的原生支持。要请求另一个域中的资源时，使用标准XHR对象并在open()中传入绝对URL即可。
标准XHR的跨域