ajax readyState的五種狀態詳解

NO IMAGE

在《Pragmatic Ajax A Web 2.0 Primer 》中對readyStae狀態的介紹,摘譯如下:
0: (Uninitialized) the send( ) method has not yet been invoked.
1: (Loading) the send( ) method has been invoked, request in progress.
2: (Loaded) the send( ) method has completed, entire response received.
3: (Interactive) the response is being parsed.
4: (Completed) the response has been parsed, is ready for harvesting.
0 - (未初始化)還沒有呼叫send()方法
1 - (載入)已呼叫send()方法,正在傳送請求
2 - (載入完成)send()方法執行完成,已經接收到全部響應內容
3 - (互動)正在解析響應內容
4 - (完成)響應內容解析完成,可以在客戶端呼叫了
對於readyState的這五種狀態,其他書中大都語焉不詳。像《Foundations of Ajax》中,只在書中的表2-2簡單地列舉了狀態的“名稱”--The state of the request. The five possible values are 0 = uninitialized, 1 = loading, 2 = loaded, 3 = interactive, and 4 = complete。而《Ajax in Action》中好像根本就沒有提到這5種狀態的細節。
《Professional Ajax》中雖不盡人意,但還是有可取之處:
There are five possible values for readyState:
0 (Uninitialized): The object has been created but the open() method hasn’t been called.
1 (Loading): The open() method has been called but the request hasn’t been sent.
2 (Loaded): The request has been sent.
3 (Interactive). A partial response has been received.
4 (Complete): All data has been received and the connection has been closed.
readyState有五種可能的值:
0 (未初始化): (XMLHttpRequest)物件已經建立,但還沒有呼叫open()方法。
1 (載入):已經呼叫open() 方法,但尚未傳送請求。
2 (載入完成): 請求已經傳送完成。
3 (互動):可以接收到部分響應資料。
4 (完成):已經接收到了全部資料,並且連線已經關閉。
在《Understanding AJAX: Using JavaScript to Create Rich Internet Applications》中,則用下表進行了說明:
readyState Status Code
Status of the XMLHttpRequest Object
(0) UNINITIALIZED 未初始化
The object has been created but not initialized. (The open method has not been called.)
(XMLHttpRequest)物件已經建立,但尚未初始化(還沒有呼叫open方法)。
(1) LOADING 載入
The object has been created, but the send method has not been called.
(XMLHttpRequest)物件已經建立,但尚未呼叫send方法。
(2) LOADED 載入完成
The send method has been called, but the status and headers are not yet available.
已經呼叫send方法,(HTTP響應)狀態及頭部還不可用。
(3) INTERACTIVE 互動
Some data has been received. Calling the responseBody and responseText properties at this state to obtain partial results will return an error, because status and response headers are not fully available.
已經接收部分資料。但若在此時呼叫responseBody和responseText屬性獲取部分結果將會產生錯誤,因為狀態和響應頭部還不完全可用。
(4) COMPLETED 完成
All the data has been received, and the complete data is available in the responseBody and responseText properties.
已經接收到了全部資料,並且在responseBody和responseText屬性中可以提取到完整的資料。
根據以上幾本書中的關於readyState五種狀態的介紹,我認為還是《Pragmatic Ajax A Web 2.0 Primer 》比較到位,因為它提到了對接收到的資料的解析問題,其他書中都沒有提到這一點,而這一點正是“(3)互動”階段作為一個必要的轉換過程存在於“(2)載入完成”到“(4)完成”之間的理由,也就是其任務是什麼。歸結起來,我覺得比較理想的解釋方法應該以“狀態:任務(目標) 過程 表現(或特徵)”表達模式來對這幾個狀態進行定義比較準確,而且讓人容易理解。
總結如下:
readyState 狀態 狀態說明
(0)未初始化
此階段確認XMLHttpRequest物件是否建立,併為呼叫open()方法進行未初始化作好準備。值為0表示物件已經存在,否則瀏覽器會報錯--物件不存在。
(1)載入
此階段對XMLHttpRequest物件進行初始化,即呼叫open()方法,根據引數(method,url,true)完成物件狀態的設定。並呼叫send()方法開始向服務端傳送請求。值為1表示正在向服務端傳送請求。
(2)載入完成
此階段接收伺服器端的響應資料。但獲得的還只是服務端響應的原始資料,並不能直接在客戶端使用。值為2表示已經接收完全部響應資料。併為下一階段對資料解析作好準備。
(3)互動
此階段解析接收到的伺服器端響應資料。即根據伺服器端響應頭部返回的MIME型別把資料轉換成能通過responseBody、responseText或responseXML屬性存取的格式,為在客戶端呼叫作好準備。狀態3表示正在解析資料。
(4)完成
此階段確認全部資料都已經解析為客戶端可用的格式,解析已經完成。值為4表示資料解析完畢,可以通過XMLHttpRequest物件的相應屬性取得資料。
概而括之,整個XMLHttpRequest物件的生命週期應該包含如下階段:
建立-初始化請求-傳送請求-接收資料-解析資料-完成
在具體應用中,明確了readyState的五個狀態(XMLHttpRequest物件的生命週期各個階段)的含義,就可以消除對Ajax核心的神祕感(語焉不詳的背後要麼是故弄玄虛,製造神祕感;要麼就是“以其昏昏,使人昭昭”),迅速把握其實質,對減少學習中的挫折感和增強自信心都極其有益。
比如,通過如下示例:
程式程式碼
//宣告陣列
var states = [“正在初始化……”,
“正在初始化請求……成功!<br/>正在傳送請求……”,
“成功!<br/>正在接收資料……”,
“完成!<br/>正在解析資料……”,
“完成!<br/>”];
//回撥函式內部程式碼片段
if (xmlHttp.readyState==4)
{
var span = document.createElement(“span”);
span.innerHTML = states[xmlHttp.readyState];
document.body.appendChild(span);
if (xmlHttp.status == 200)
{
var xmldoc = xmlHttp.responseXML;
//其他程式碼
}
//別忘記銷燬,防止記憶體洩漏
xmlHttp = null;
}
else
{
var span = document.createElement(“span”);
span.innerHTML = states[xmlHttp.readyState];
document.body.appendChild(span);
}
結果如下:
正在初始化請求……成功!
正在傳送請求……成功!
正在接收資料……完成!
正在解析資料……完成!
我們很容易明白XMLHttpRequest物件在各個階段都在做什麼。因此,也就很容易對Ajax的核心部分有一個真正簡單明瞭的理解。
附:
Example 1
readyState 返回XMLHTTP請求的當前狀態
語法 lValue = oXMLHttpRequest.readyState;
程式程式碼
var XmlHttp;
XmlHttp = new ActiveXObject(“Msxml2.XMLHTTP.3.0”);
function send() {
XmlHttp.onreadystatechange = doHttpReadyStateChange;
XmlHttp.open(“GET”, “http://localhost/sample.xml”, true);
XmlHttp.send();
}
function doHttpReadyStateChange() {
if (XmlHttp.readyState == 4) {
alert(“Done”);
}
}
備註 變數,此屬性只讀,狀態用長度為4的整型表示.定義如下:
0 (未初始化) 物件已建立,但是尚未初始化(尚未呼叫open方法)
1 (初始化) 物件已建立,尚未呼叫send方法
2 (傳送資料) send方法已呼叫,但是當前的狀態及http頭未知
3 (資料傳送中) 已接收部分資料,因為響應及http頭不全,這時通過responseBody和responseText獲取部分資料會出現錯誤,
4 (完成) 資料接收完畢,此時可以通過通過responseBody和responseText獲取完整的迴應資料
Example 2
下面這個範例說明如何在執行時以 VBScript 程式碼讀取 RDS.DataControl 物件的 ReadyState 屬性。ReadyState 為只讀屬性。
要測試該範例,請剪下該程式碼並貼上到標準 HTML 文件的 <Body></Body> 標記之間,然後將其命名為“ADCapi9.asp”,ASP 指令碼將標識伺服器。
程式程式碼
<Center>
<H2>RDS API Code Examples </H2>
<HR>
<H3> RDS.DataControl ReadyState property</H3>
</Center>
<!– 在執行時設定引數的 RDS.DataControl –>
<OBJECT classid=”clsid:BD96C556-65A3-11D0-983A-00C04FC29E33″
ID=ADC>
<PARAM NAME=”SQL” VALUE=”Select * from Employee for browse”>
<PARAM NAME=”SERVER” VALUE=”http://<%=Request.ServerVariables(“SERVER_NAME”)%>”>
<PARAM NAME=”CONNECT” VALUE=”dsn=ADCDemo;UID=ADCDemo;PWD=ADCDemo;”>
<PARAM NAME=”ExecuteOptions” VALUE=”adcExecAsync”>
<PARAM NAME=”FetchOptions” VALUE=”adcFetchAsync”>
</OBJECT>
<Script Language=”VBScript”>
Sub Window_OnLoad
Select Case ADC1.ReadyState
case 2: MsgBox “Executing Query”
case 3: MsgBox “Fetching records in background”
case 4: MsgBox “All records fetched”
End Select
End Sub
</Script>

您可能感興趣的文章:

C#.NET中如何批量插入大量資料到資料庫中Asp.Net使用Bulk實現批量插入資料C#/.Net 中快速批量給SQLite資料庫插入測試資料asp.net新聞列表生成靜態頁之批量和單頁生成在ASP.NET 2.0中運算元據之六十二:GridView批量更新資料在ASP.NET 2.0中運算元據之六十四:GridView批量新增資料在ASP.NET 2.0中運算元據之三十七:DataList批量更新AJAX(XMLHttpRequest.status)狀態碼javascript學習筆記(七)Ajax和Http狀態碼asp.net執行緒批量匯入資料時通過ajax獲取執行狀態