Ajax| QuickStart A good grasp of AJAX technology is the understanding of Hypertext Transfer Protocol (HTTP), which is used to transfer Web pages, images, and other types of files on the Internet that are transmitted between browsers and servers. As long as you enter a URL in the browser, the front http://means to use HTTP to access the information at the specified location. (Most browsers also support a number of other different protocols, where FTP is a typical example.) )
Note: The HTTP protocol is covered in this article, which is of interest to Ajax developers and serves as a reference manual or guide to HTTP.
HTTP is made up of two parts: request and response. When you enter a URL in a Web browser, the browser creates and sends a request based on your request, which contains the URL entered and some information related to the browser itself. When the server receives this request, it returns a response that includes the information associated with the request and the data at the specified URL, if any. Until the browser resolves the response and displays the Web page (or other resources).
HTTP request
The format of the HTTP request is as follows:
In an HTTP request, the first line must be a request line, which describes the type of request, the resource to be accessed, and the HTTP version used. This is followed by a header (header) section that describes the additional information that the server will use. After the header is a blank line, after which you can add any additional data [called the body].
In HTTP, a large number of request types are defined, but Ajax developers are concerned only with get requests and post requests. Whenever you enter a URL on a Web browser, the browser sends a GET request to the server based on that URL to tell the server what resources to retrieve and return. The GET request for www.wrox.com is as follows:
get/http/1.1 Host:www.wrox.com user-agent:mozilla/5.0 (Windows; U Windows NT 5.1; En-us; rv:1.7.6) gecko/20050225 firefox/1.0.1 Connection:keep-alive |
The first part of the request line indicates that the request is a GET request. The second part of the line is a slash (/) that is used to indicate that the root directory of the domain name is being requested. The last part of the line shows that the version of HTTP 1.1 is used (another option is 1.0). So where does the request go? This is the second line of content.
Line 2nd is the first header of the request, HOST. The header host will indicate the destination of the request. Combining the host and the slash (/) in the previous line, you can notify the server that the request is www.wrox.com/(HTTP 1.1 only needs to use the first host, whereas the original version 1.0 does not need to be used). The third line contains the first user-agent, which is accessible to both server and client script, and is an important basis for browser type detection logic. This information is defined by the browser you are using (in this case, the Firefox 1.0.1) and will be sent automatically in each request. The last row is the first connection, which typically sets the browser action to Keep-alive (or, of course, to other values, but this is beyond the scope of this book). Note that there is a blank line after the last header. This blank line is required even if the request body does not exist.
If you want to get a page in a www.wrox.com domain such as http://www.wrox.com/books, the request might look like this:
get/books/http/1.1 Host:www.wrox.com user-agent:mozilla/5.0 (Windows; U Windows NT 5.1; En-us; rv:1.7.6) gecko/20050225 firefox/1.0.1 Connection:keep-alive |
Note that only the contents of the first row have changed, and it contains only the part of the URL that follows the www.wrox.com.
To send the parameters of a GET request, you must enclose the additional information behind the URL itself. The format is similar to the following:
Url? Name1=value1&name2=value2& &namen=valuen |
This information, called a query string, is copied to the request line of the HTTP request, as follows:
Get/books/?name=professional%20ajax http/1.1 Host:www.wrox.com user-agent:mozilla/5.0 (Windows; U Windows NT 5.1; En-us; rv:1.7.6) gecko/20050225 firefox/1.0.1 Connection:keep-alive |
Note that in order to use the text "Professional Ajax" as a URL parameter, you need to encode its contents and replace the spaces with%20, which is called URL encoding (URL encoding). Many places that are commonly used in HTTP (JavaScript provides built-in functions to handle URL encoding and decoding, which are described in later sections of this chapter). "Name-value" (Name-value) is separated by &. Most server-side technologies can automatically decode the request body and provide some logical means for accessing these values. Of course, how to use this data is still determined by the server.
The header that the browser sends is usually much more than what is discussed in this article. For simplicity's sake, the examples here are as brief as possible.
On the other hand, post requests provide some additional information to the server in the request body. Typically, when you fill out an online form and submit it, the data that is filled in is sent to the server in the form of a POST request.
The following is a typical POST request:
post/http/1.1 Host:www.wrox.com user-agent:mozilla/5.0 (Windows; U Windows NT 5.1; En-us; rv:1.7.6) gecko/20050225 firefox/1.0.1 content-type:application/x-www-form-urlencoded Content-length:40 Connection:keep-alive Name=professional%20ajax&publisher=wiley |
As you can see from the above, there are some differences between post requests and get requests. First, the get at the beginning of the request line is changed to post to indicate a different request type. You will find that the first host and user-agent still exist, and there are two new lines behind it. The first content-type describes how the content of the request body is encoded. Browsers always transmit data in application/x-www-form-urlencoded format, which is a MIME type encoded for a simple URL. The header Content-length describes the number of bytes of the request body. After the first connection is a blank line followed by the request body. As with most browser post requests, this is given in the form of a simple "name-value" pair, where name is professional Ajax,publisher is Wiley. You can organize query string parameters for URLs in the same format.
As mentioned earlier, there are other types of HTTP requests that conform to the same basic format as GET requests and post requests. Next, let's see what response the server will send to the HTTP request.
HTTP Response
As shown below, the format of the HTTP response is very similar to the format of the request:
As you can see, the only real difference in response is that the first line replaces the request information with state information. The status line indicates the requested resource condition by providing a status code. Here is an example of an HTTP response:
http/1.1 OK Date:sat, Dec 23:59:59 GMT Content-type:text/html;charset=iso-8859-1 content-length:122
Wrox Homepage
!--body goes here-->
|
In this case, the status line gives an HTTP status code of 200, and the message OK. The status line always contains a status code and a corresponding short message to avoid confusion. The most commonly used status codes are:
(OK): Found the resource, and everything is OK.
304 (not MODIFIED): The resource has not been modified since the last request. This is commonly used for caching mechanisms in browsers.
401 (Unauthorized):
The client is not authorized to access the resource. This usually causes the browser to require the user to enter a user name and password to log on to the server.
403 (Forbidden):
Client failed to obtain authorization. This is usually followed by an incorrect user name or password entered after 401.
404 (Not FOUND):
The requested resource does not exist at the specified location.
After the status line is some header. Typically, the server returns a header named data that describes the date and time the response was generated (the server usually returns some information about itself, although not required). The next two first should be familiar with the same content-type and content-length as the POST request. In this case, the header content-type specifies the MIME type HTML (text/html), and the encoding type is iso-8859-1 (this is the encoding standard for U.S. English resources). The response body contains the HTML source file of the requested resource (although it may also contain binary data for plain text or other resource types). The browser will display this data to the user.
Note that there is no indication of the type of request for the response, but this is not important for the server. The client knows what type of data each type of request will return and determines how to use the data.