Details about the five States of readystate in Ajax

Source: Internet
Author: User

In pragmatic Ajax a Web 2.0 primer, I accidentally saw an introduction to the readystae status. I think this introduction is very practical. The excerpt is as follows:

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 ed.
3: (interactive) The response is being parsed.
4: (completed) the response has been parsed, is ready for harvesting.

0-(not initialized) The send () method has not been called
1-(load) The send () method has been called and a request is being sent.
2-(Loading completed) The send () method is executed completely and all response content has been received
3-(interaction) parse the response content
4-(complete) The response content has been parsed and can be called on the client

The five States of readystate are mostly unknown in other books. Like foundations of Ajax, the state "name" -- the state of the request is simply listed in Table 2-2 of the book. the five possible values are 0 = uninitialized, 1 = loading, 2 = loaded, 3 = interactive, and 4 = complete. Ajax in action does not seem to mention the details of these five States at all. Although not satisfactory in professional Ajax, there are still merits:

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 already ed.
4 (complete): All data has been encrypted Ed and the connection has been closed.

Readystate has five possible values:
0 (not initialized): (XMLHttpRequest) the object has been created, but the open () method has not been called.
1 (load): the open () method has been called, but no request has been sent.
2 (Loading completed): The request has been sent completely.
3 (interaction): Some response data can be received.
4 (complete): All data has been received and the connection has been closed.

In 《Understanding Ajax: using JavaScript to create rich Internet applications", The following table is used for description:

Readystate status code

Status ofXMLHttpRequestObject
(0) uninitialized
Not initialized
The object has been created but not initialized. (OpenMethod has not been called .)
(XMLHttpRequest) the object has been created, but has not been initialized (the open method has not been called ).
(1) Loading
Load
The object has been created, butSendMethod has not been called.
(XMLHttpRequest) the object has been created, but the send method has not been called.
(2) loaded
Load completed
TheSendMethod has been called, but the status and headers are not yet available.
The send method has been called, and the (HTTP Response) status and header are not available yet.
(3) Interactive
Interaction
Some data has been received. CallingResponsebodyAndResponsetextProperties at this state to obtain partial results will return an error, because status and Response Headers are not fully available.
Some data has been received. However, if you call the responsebody and responsetext attributes to obtain some results at this time, an error will occur because the status and response header are not fully available.
(4) Completed
Complete
All the data has been encoded ed, and the complete data is available inResponsebodyAndResponsetextProperties.
All data has been received, and the complete data can be extracted from the responsebody and responsetext attributes.

Based on the introduction of the five States of readystate in the above books, I think pragmatic Ajax a Web 2.0 primer is in place because it mentions the issue of parsing the received data, this is not mentioned in other books, and it is the "(3) interaction" stage as a necessary conversion process that exists in "(2) Loading completed" to "(4) the reason between completion is what the task is. To sum up, I think the ideal interpretation method should be to define the States accurately in the "State: task (target) + process + performance (or feature)" expression mode, it is easy to understand. The following is a summary:

Readystate status

Status description

(0) not initialized

In this phase, check whether the XMLHTTPRequest object is created and make preparations for calling the open () method for initialization. If the value is 0, the object already exists. Otherwise, the browser reports an error -- the object does not exist.

(1) Load

In this phase, the XMLHTTPRequest object is initialized, that is, the open () method is called, and the object state is set according to the parameter (method, URL, true. And call the send () method to start sending requests to the server. If the value is 1, a request is being sent to the server.

(2) Load completed

In this phase, the server receives response data. However, the raw data returned by the server cannot be directly used on the client. If the value is 2, all response data has been received. Prepare for data parsing in the next stage.

(3) Interaction

This phase parses the received server response data. That is, the data is converted into a format that can be accessed through the responsebody, responsetext, or responsexml Attribute Based on the MIME type returned by the response header of the server, so as to prepare for the client call. Status 3 indicates that the data is being parsed.

(4) Completed

At this stage, it is confirmed that all data has been resolved to the available format of the client, and the resolution has been completed. If the value is 4, the data is parsed. You can use the corresponding attributes of the XMLHTTPRequest object to obtain the data.

Specifically, the lifecycle of the XMLHTTPRequest object should include the following stages:
Create-initialize request-Send request-receive data-parse data-complete

In specific applications, the meaning of the five States of readystate (each stage of the lifecycle of the XMLHTTPRequest object) can be clarified to eliminate the mystery of the Ajax core, create a mysterious sense, or be "stunned by others"), quickly grasp the essence, is extremely beneficial to reduce the frustration in learning and enhance self-confidence.

For example, the following example is used:

// Declare the array var States = ["Initializing ......", "Initializing the request ...... Successful! Sending request ......", "Successful! Receiving data ......", "Done! Parsing data ......", "Done!"]; // The internal code snippet of the callback function, 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; // other code} // do not forget to destroy it to prevent memory leakage XMLHTTP = NULL;} else {var span = document. createelement ("span"); span. innerhtml = States [XMLHTTP. readystate]; document. body. appendchild (SPAN );}

The result is as follows:

Initializing request ...... Successful!
Sending request ...... Successful!
Receiving data ...... Done!
Parsing data ...... Done!

It is easy to understand what the XMLHTTPRequest object is doing at each stage. Therefore, it is easy to have a simple and clear understanding of the core part of Ajax.

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.