全面剖析XMLHttpRequest对象（2）

<!---->

三、 XMLHttpRequest 对 象的方法

　　 XMLHttpRequest对 象提供了各 种 方法用于初始化和 处 理 HTTP请 求，下列将逐个展 开详细讨论 。

　　 abort()方法

　　你可以使用 这 个 abort()方法来 暂 停与一个 XMLHttpRequest对 象相 联 系的 HTTP请 求，从而把 该对 象 复 位到未初始化状 态 。

　　 open()方法

　 　你需要 调 用 open(DOMString method， DOMString uri， boolean async， DOMString username， DOMString password)方法初始化一个 XMLHttpRequest对 象。 其中， method 参数是必 须 提供的 - 用于指定你想用来 发 送 请 求的 HTTP 方法 (GET ， POST ， PUT ， DELETE 或 HEAD) 。 为 了把数据 发 送到服 务 器， 应该 使用 POST 方法； 为 了从服 务 器端 检 索数据， 应该 使用 GET 方法。 另外， uri 参数用于指定 XMLHttpRequest 对 象把 请 求 发 送到的服 务 器相 应 的 URI 。借助于 window.document.baseURI 属 性， 该 uri 被解析 为 一个 绝对 的 URI- 换 句 话说 ，你可以使用相 对 的 URI- 它将使用与 浏览 器解析相 对 的 URI 一 样 的方式被解析。 async 参数指定是否 请 求是异 步 的 - 缺省 值为 true 。 为 了 发 送一个同 步请 求，需要把 这 个参数 设 置 为 false 。 对 于要求 认证 的服 务 器， 你可以提供可 选 的用 户 名和口令参数。在 调 用 open() 方法后， XMLHttpRequest 对 象把它的 readyState 属性 设 置 为 1( 打 开 ) 并且把 responseText 、 responseXML 、 status 和 statusText 属性 复 位到它 们 的初始 值 。另外，它 还复 位 请 求 头 部。注意，如果你 调 用 open() 方法并且此 时 readyState 为 4 ， 则 XMLHttpRequest 对 象将 复 位 这 些 值 。

　　 send() 方法

　　在通 过调 用 open() 方法准 备 好一个 请 求之后，你需要把 该请 求 发 送到服 务 器。 仅 当 readyState 值为 1 时 ，你才可以 调 用 send() 方法；否 则 的 话 ， XMLHttpRequest 对 象将引 发 一个异常。 该请 求被使用提供 给 open() 方法的参数 发 送到服 务 器。当 async 参数 为 true 时 ， send() 方法立即返回，从而允 许 其它客 户 端脚本 处 理 继续 。在 调 用 send() 方法后， XMLHttpRequest 对 象把 readyState 的 值设 置 为 2( 发 送 ) 。当服 务 器响 应时 ，在接收消息体之前，如果存在任何消息体的 话 ， XMLHttpRequest 对 象将把 readyState 设 置 为 3( 正在接收中 ) 。当 请 求完 成加 载时 ，它把 readyState 设 置 为 4( 已加 载 ) 。 对 于一个 HEAD 类 型的 请 求，它将在把 readyState 值设 置 为 3 后再立即把它 设 置 为 4 。

　　 send() 方法使用一个可 选 的参数 - 该 参数可以包含可 变类 型的数据。典型地，你使用它并通 过 POST 方法 把数据 发 送到服 务 器。另外，你可以 显 式地使用 null 参数 调 用 send() 方法， 这 与不用参数 调 用它一 样 。 对 于大多数其它的数据 类 型，在 调 用 send() 方法之前， 应该 使用 setRequestHeader() 方法 ( 见 后面的解 释 ) 先 设 置 Content-Type 头 部。如 果在 send(data) 方法中的 data 参数的 类 型 为 DOMString ，那 么 ，数据将被 编码为 UTF-8 。如果数据是 Document 类 型，那 么 将使用由 data.xmlEncoding 指定的 编码 串行化 该 数据。

　　 setRequestHeader() 方法

　　 该 setRequestHeader(DOMString header ， DOMString value) 方法用来 设 置 请 求的 头 部信息。当 readyState 值为 1 时 ，你可以在 调 用 open() 方法后 调 用 这 个方法；否 则 ，你将得到一个异常。

　　 getResponseHeader() 方法

　　 getResponseHeader(DOMString header ， value) 方法用于 检 索响 应 的 头 部 值 。 仅 当 readyState 值 是 3 或 4( 换 句 话说 ，在响 应头 部可用以后 ) 时 ，才可以 调 用 这 个方法；否 则 ， 该 方法返回一个空字符串。

　　 getAllResponseHeaders()方法

　　 该 getAllResponseHeaders()方法以一个字符串形式返回所有的响 应头 部（ 每 一个 头 部占 单 独的一行）。如果 readyState的 值 不是 3或 4， 则该 方法返回 null。

 

 

四、 发 送 请 求

　　在 AJAX中， 许 多使用 XMLHttpRequest的 请 求都是从一个 HTML事件（例如一个 调 用 JavaScript函数的按 钮 点 击 (onclick)或一个按 键 (onkeypress)）中被初始化的。 AJAX 支持包括表 单 校 验 在内的各 种应 用程 序。有 时 ，在填充表 单 的其它内容之前要求校 验 一个唯一的表 单 域。例如要求使用一个唯一的 UserID 来注册表 单 。如果不是使用 AJAX 技 术 来校 验这 个 UserID 域，那 么 整个表 单 都必 须 被填充和提交。如果 该 UserID 不是有效的， 这 个表 单 必 须 被重新提交。例如，一个相 应 于一个要求必 须 在服 务 器端 进 行 校 验 的 Catalog ID 的表 单 域可能按下列形式指定：

＜ form name="validationForm" action="validateForm" method="post"＞
＜ table＞
　＜ tr＞＜ td＞ Catalog Id:＜ /td＞
　　＜ td＞
　　　＜ input type="text" size="20" id="catalogId" name="catalogId" autocomplete="off" onkeyup="sendRequest()"＞
　　＜ /td＞
　　＜ td＞＜ div id="validationMessage"＞＜ /div＞＜ /td＞
　＜ /tr＞
＜ /table＞＜ /form＞

　 　前面的 HTML使用 validationMessage div来 显 示相 应 于 这 个 输 入域 Catalog Id的一个校 验 消息。 onkeyup事件 调 用一个 JavaScript sendRequest()函数。 这 个 sendRequest()函数 创 建一个 XMLHttpRequest对 象。 创 建一个 XMLHttpRequest 对 象的 过 程因 浏览 器 实现 的不同而有所区 别 。如果 浏览 器支持 XMLHttpRequest 对 象作 为 一个窗口属性 ( 所有普通的 浏览 器 都是 这样 的，除了 IE 5 和 IE 6 之外 ) ，那 么 ，代 码 可以 调 用 XMLHttpRequest 的构造器。如果 浏览 器把 XMLHttpRequest 对 象 实现为 一个 ActiveXObject 对 象 ( 就象在 IE 5 和 IE 6 中一 样 ) ，那 么 ，代 码 可以使用 ActiveXObject 的构造器。下面的函数将 调 用一个 init() 函数，它 负责检查 并决定要使用的适当的 创 建方法 - 在 创 建和返回 对 象之前。

＜ script type="text/javascript"＞
function sendRequest(){
　 var xmlHttpReq=init();
　 function init(){
　　 if (window.XMLHttpRequest) {
　　　 return new XMLHttpRequest();
　　 }
　 else if (window.ActiveXObject) {
　　 return new ActiveXObject("Microsoft.XMLHTTP");
　 }
}
＜ /script＞

　　接下来，你需要使用 Open()方法初始化 XMLHttpRequest对 象 -指定 HTTP方法和要使用的服 务 器 URL。

var catalogId=encodeURIComponent(document.getElementById("catalogId").value);
xmlHttpReq.open("GET"， "validateForm?catalogId=" + catalogId， true);

　　默 认 情况下，使用 XMLHttpRequest 发 送的 HTTP 请 求是异 步进 行的，但是你可以 显 式地把 async 参数 设 置 为 true ，如上面所展示的。
在 这种 情况下， 对 URL validateForm 的 调 用将激活服 务 器端的一个 servlet ，但是你 应该 能 够 注意到服 务 器端技 术 不是根本性的； 实际 上， 该 URL 可能是一个 ASP ， ASP.NET 或 PHP 页 面或一个 Web 服 务 - 这 无 关紧 要，只要 该页 面能 够 返回一个响 应 - 指示 CatalogID 值 是否是有效的 - 即可。因 为 你在 作一个异 步调 用，所以你需要注册一个 XMLHttpRequest 对 象将 调 用的回 调 事件 处 理器 - 当它的 readyState 值 改 变时调 用。 记 住， readyState值 的改 变 将会激 发 一个 readystatechange事件。你可以使用 onreadystatechange属性来注册 该 回 调 事件 处 理器。

<!---->

xmlHttpReq.onreadystatechange=processRequest;

　　然后，我 们 需要使用 send() 方法 发 送 该请 求。因 为这 个 请 求使用的是 HTTP GET 方法，所以，你可以在不指定参数或使用 null 参数的情况下 调 用 send() 方法。

xmlHttpReq.send(null);