Ajax的核心技术XMLHttpRequest方法

整个Ajax技术紧紧围绕在XMLHttpRequest对象的周围，Ajax整个技术的过程如下：XMLHttpRequest发送请求，在与服务器交互中，其readyState状态可以监听到服务器

的响应状态，当服务器的响应完成的时候，XMLHttpRequest负责解析服务器响应，获取到响应之后，解析出响应的数据，通过DOM操作来加载服务器的响应。

XMLHttpRequest方法
abort（）：停止发送当前请求
getAllResponseHeader（）：获取服务器返回的的全部响应头
getResponseHeader("headerLabel"):根据响应头的名字获取对应的响应
open（"method","URL"[,asyncFlag[,"userName"[,"password"］]）
建立连接，设置方法和是否使用异步请求。用户名及密码
send(content):发送请求
setRequestHeader("label","value")：发送请求前，先设置请求头

XMLHttpRequest 属性
onreadystatechange :用于指定XMLHttpRequest对象状态变化时的事件处理函数
readyState ： XMLHttpRequest对象的处理状态
responseText ：用于获取服务器的响应文本
responseXML ：用于获取服务器响应的XML文档对象
status ：服务器返回的状态码
statusText ：服务器返回的状态文本信息
XMLHttpRequest 对象状态（readyState）
0 对象还没有完成初始化
1 对象开始发送请求
2 对象的请求发送完成
3 对象开始读取服务器的响应
4 对象读取服务器响应结束
服务器响应有很多种，通过XMLHttpResponse对象的status和statusText属性都可以判断服务器响应是否正常。只有当服务器响应正常时，js才应该读取服务器响应信息。

服务器常用状态码如下。
200 ：服务器响应正常
304 ：该资源在上次请求后没有任何修改，通常用于浏览器的缓存机制
400 ：无法找到请求的资源
401 ：访问资源的权限不够
403 ：没有权限访问资源
404 ：需要访问的资源不存在
405 ：需要访问的资源被禁止
407 : 访问的资源需要代理身份验证
414 ：请求的URL太长
500 ：服务器内部错误
当readyState的值为4时，响应完成；当status的值为200时，服务器响应正确。
发送请求步骤：
初始化XMLHttpRequest对象
打开连接：确定发送请求的方法：GET或POST，以及是否采用异步方式
设置XMLHttpRequest状态改变时的事件处理函数
发送请求，如采用POST方法发送，可发送带参数的请求
创建XMLHttpRequest对象
function createXHR(){
if(window.XMLHttpRequest){
xhr=new XMLHttpRequest();
}else if(window.ActiveXObject){
xhr=new ActiveXObject("Microsoft.XMLHttp");
}else return null;
}
open()通常有三个参数：方法（get或post）、url、设置是否异步（TRUE或FALSE）
GET和POST
GET请求用于从服务器上获取数据；将参数数据转换成一个字符串，并将字符串添加到请求的服务器程序URL之后
POST请求用于向服务器发送数据；通过HTTP POST机制将请求的参数以及对应的值放在HTML HEADER中传输，用户看不到明码的请求参数值。
通常在传输请求参数时，建议使用POST请求
发送POST请求
使用open方法打开连接时，指定使用POST方法发送请求
设置正确的请求头，POST请求通常应设置Content-Type请求头
发送请求，请求参数可以在send方法中确定 “xmlRequest.send("id="+id)；”
即使没有请求参数，使用send方法时，也一定要为其传入null参数。
发送XML请求
xml请求实质还是post请求，只是在发送请求的时侯将请求参数封装成XML字符串形式，服务器端则负责解析该字符串
客户端页面需要增加一个方法来创建XML字符串（如createXML（）），将字符串作为send的参数“send（createXML（））”
服务器端：// 定义一个StringBuffer对象来接受请求参数
StringBuffer xmlBuffer=new StringBuffer();
String line=null;
//通过request对象获取输入流
BufferReader reader=request.getReader();
//依次读取请求输入流的数据
while((line=reader.readeLine())!=null){
xmlBuffer.append(line);
//将输入流中读取的内容转换为字符串
String xml=xmlBuffer.toString();
//以DOM4J方式解析xml字符串
Document xmlDoc=new XPPReader().read(new ByteArrayInputStream(xml.getBytes()));
......
处理服务器相应
处理的时机
if(xmlRequest.readyState==4&&(xmlRequest.status==200||
xmlRequest.status==304)){
..........
responseText与responseXML
文本响应：客户端需要自己分析字符串，并将字符串解析成更加复杂的形式
xml响应：借助浏览器解析xml文档的能力。
var xmldoc=xmlrequest.responseXML
XMLHttpRequest对象的运行周期
step 1 创建一个XMLHttpRequest实例，然后用它来发送请求，这种请求可以是GET方式，也可以是POST
step 2 XMLHttpRequest发送后，服务器的响应何时到达、核实处理需要借助js的事件机制。XMLHttpRequest能触发的事件是onreadystatechange，
当XMLHttpRequest对象的状态改变是，将触发XMLHttpRequest对象指定的onreadystatechange事件（为其绑定回调函数）
step 3 readyState==4&&(xmlRequest.status==200||xmlRequest.status==304)时，可以开始处理服务器响应
step 4 触发回调函数
step 5 回调函数需借助XMLHttpRequest来解析服务器响应，当调用responseText或responseXML获取服务器响应后，XMLHttpRequest对象的运行周期结束
step 6 js处理服务器响应

原文地址：https://www.jb51.cc/ajax/165536.html