AJAX用戶端說明，XMLHttpRequest對象

在CommunityServer中運用了自己的AJAX機制，沒有藉助其他的輔助控制項。其中客戶的XMLHttpRequest對象的封裝，就足以讓人大飽眼福，在一般的瀏覽器其都能夠運行AJAX。下面我們來學習學習這個咚咚，希望能給更多的人帶來協助。

首先當然是要瞭解一下瀏覽器中的XMLHttp對象了：

XMLHTTP方法：
備忘：客戶機可以使用XMLHTTP對象發送任意的HTTP請求,接受HTTP應答,還可以對應答的XML文檔進行解析。

Open方法：初始化一個Msxml2.XMLHTTP請求，指定HTTP請求方式、URL以及評鑑資訊。

文法：
Open（ bstrMethod, bstrUrl, varAsync, bstrUser, bstrPassword ）

參數介紹：

bstrMethod： 資料傳送方式，即GET或POST。
bstrUrl： 服務網頁的URL。
varAsync： 是否同步執行。預設為True，即同步執行，但只能在DOM中實施同步執行。用中一般將其置為False，即非同步執行。
bstrUser： 使用者名稱，可省略。
bstrPassword：使用者口令，可省略。

Send方法：發送HTTP請求到伺服器，返回應答。

文法：
oXMLHttpRequest.send(varBody)

說明：此方法是否同步取決於Open方法的varAsync參數。如果設為True則為同步，調用立刻返回，如果設為False調用直到整個應答被接收了才返回。

setRequestHeader（ bstrHeader, bstrvalue ）

bstrHeader：HTTP 頭(header)
bstrvalue： HTTP 頭(header)的值

如果Open方法定義為POST，可以定義表單方式上傳：
xmlhttp.setRequestHeader（ "Content-Type", "application/x-www-form-urlencoded"）

XMLHTTP屬性：

onreadystatechange：在同步執行方式下獲得返回結果的事件控制代碼。只能在DOM中調用。
responseBody： 結果返回為不帶正負號的整數數組。
responseStream： 結果返回為IStream流。
responseText ： 結果返回為字串。
responseXML： 結果返回為XML格式資料。

運用這個原理也可以做網路小偷程式，網路爬蟲應該就是應用這個東西來完成的吧，不過我沒有做過，可能在不久的將來會製作個來玩玩，這裡我們最主要的是看看CS中是如何封裝他的：

1//Ajax Start
2/**////<summary>
3///建立回調對象，如果存在window.XMLHttpRequest()對象,則返回此對象，如果是IE則搜尋Msxml2.XMLHTTP各個版本及Microsoft.XMLHTTP並建立對象返回。
4///</summary>
5function Ajax_GetXMLHttpRequest() {
6 if (window.XMLHttpRequest) {
7 return new XMLHttpRequest();
8 } else {
9 if (window.Ajax_XMLHttpRequestProgID) {
return new ActiveXObject(window.Ajax_XMLHttpRequestProgID);
} else {
var progIDs = ["Msxml2.XMLHTTP.5.0", "Msxml2.XMLHTTP.4.0", "MSXML2.XMLHTTP.3.0", "MSXML2.XMLHTTP", "Microsoft.XMLHTTP"];
for (var i = 0; i < progIDs.length; ++i) {
var progID = progIDs[i];
try {
var x = new ActiveXObject(progID);
window.Ajax_XMLHttpRequestProgID = progID;
return x;
} catch (e) {
}
}
}
}
return null;
}
/**////<summary>
///Ajax回調。
///</summary>
///<param name="type">調用服務端函數所在的類包括命名空間(如：NExplus.Controls.SiteHeader)。</param>
///<param name="id">用戶端所對應的標記的ID(如：<div id="ID"></div>)。</param>
///<param name="method">服務端(方法)函數名稱(被AjaxMethod標記)。</param>
///<param name="args">傳到伺服器的字串。</param>
///<param name="clientCallBack">同步或非同步回調。</param>
///<param name="debugRequestText">調試/請求字串。</param>
///<param name="debugResponseText">調試/輸出字串。</param>
///<param name="debugErrors">調試的錯誤資訊。</param>
///<param name="includeControlValuesWithCallBack">是否和控制項及其值一起回調。</param>
///<param name="url">Url地址。</param>
function Ajax_CallBack(type, id, method, args, clientCallBack, debugRequestText, debugResponseText, debugErrors, includeControlValuesWithCallBack, url) {

if (!url)
{
url = window.location.href;
url = url.replace(/\#.*$/, '');//去除URL中標籤部分，即"#"之後的字串。
//加入參數Ajax_CallBack並設為true,說明是AJAX回調。
if (url.indexOf('?') > -1)
url += "&Ajax_CallBack=true";
else
{
if (url.substr(url.length - 1, 1) == "/")
url += "default.aspx";

url += "?Ajax_CallBack=true";
}
}

var x = Ajax_GetXMLHttpRequest();//取得XMLHttpRequest對象。
var result = null;
if (!x) {
result = { "value":null, "error": "NOXMLHTTP"};
if (debugErrors) {
alert("error: " + result.error);
}
if (clientCallBack) {
clientCallBack(result);
}
return result;
}

x.open("POST", url, clientCallBack ? true : false);//以Post方式開啟對象，這樣在服務端就可以用Request.Form擷取參數。
x.setRequestHeader("Content-Type", "application/x-www-form-urlencoded; charset=utf-8");
if (clientCallBack) {
//如果同步，判斷狀態，輸出錯誤訊息。
x.onreadystatechange = function() {
var result = null;

if (x.readyState != 4) {
return;
}

if (debugResponseText) {
alert(x.responseText);
}

try
{
var result = eval("(" + x.responseText + ")");
if (debugErrors && result.error) {
alert("error: " + result.error);
}
}
catch (err)
{
if (window.confirm('The following error occured while processing an AJAX request: ' + err.message + '\n\nWould you like to see the response?'))
{
var w = window.open();
w.document.open('text/plain');
w.document.write(x.responseText);
w.document.close();
}

result = new Object();
result.error = 'An AJAX error occured. The response is invalid.';
}

clientCallBack(result);
}
}
var encodedData = "Ajax_CallBackType=" + type;
if (id) {
encodedData += "&Ajax_CallBackID=" + id.split("$").join(":");
}
encodedData += "&Ajax_CallBackMethod=" + method;
if (args) {
for (var i in args) {
encodedData += "&Ajax_CallBackArgument" + i + "=" + encodeURIComponent(args[i]);
}
}
//如果加入控制項，則加入控制項資料。
if (includeControlValuesWithCallBack && document.forms.length > 0) {
var form = document.forms[0];
for (var i = 0; i < form.length; ++i) {
var element = form.elements[i];
if (element.name) {
var elementValue = null;
if (element.nodeName == "INPUT") {
var inputType = element.getAttribute("TYPE").toUpperCase();
if (inputType == "TEXT" || inputType == "PASSWORD" || inputType == "HIDDEN") {
elementValue = element.value;
} else if (inputType == "CHECKBOX" || inputType == "RADIO") {
if (element.checked) {
elementValue = element.value;
}
}
} else if (element.nodeName == "SELECT") {
elementValue = element.value;
} else if (element.nodeName == "TEXTAREA") {
elementValue = element.value;
}
if (elementValue) {
encodedData += "&" + element.name + "=" + encodeURIComponent(elementValue);
}
}
}
}
//如果是調試，則彈出發送的資料。
if (debugRequestText) {
alert(encodedData);
}
x.send(encodedData);//向伺服器發送資料。
if (!clientCallBack) {
if (debugResponseText) {
alert(x.responseText);
}
result = eval("(" + x.responseText + ")");
if (debugErrors && result.error) {
alert("error: " + result.error);
}
}
delete x;
return result;
}

//Ajax End
其他的不用多說明了，看注釋應該就差不多了，如果有不對的地方請批評指教，謝謝！