Sometimes you won’t need to retrieve any content from the server, for instance, in the case where you just want to “ping” the server to verify that it is operational. You may want to simply read the response headers sent by the server and ignore the content. By reading the response headers, you can find out the Content-Type, the Content-Length, or even the Last-Modifieddate.
The standard way to perform a request where you’re interested only in the response headers is to use a HEADrequest, as opposed to a GETor POSTrequest as discussed earlier. When a server responds to a HEADrequest, it sends only the response headers, omitting the content even if the requested content could be returned to the browser. By omitting the content, the response to a
HEADrequest is much smaller than a GETor POSTresponse.
Listing 4-3 demonstrates the various ways in which you can retrieve the response headers from the XMLHttpRequest object and use them for practical purposes. The page has four links on it that exercise various methods on the XMLHttpRequest object to read the response headers.
Figure 4-1.Entering an invalid date
Listing 4-3.readingResponseHeaders.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Reading Response Headers</title>
<script type="text/javascript"> var xmlHttp; var requestType = ""; function createXMLHttpRequest() { if (window.ActiveXObject) { xmlHttp = new ActiveXObject("Microsoft.XMLHTTP"); } else if (window.XMLHttpRequest) { xmlHttp = new XMLHttpRequest(); } }
function doHeadRequest(request, url) { requestType = request;
createXMLHttpRequest();
xmlHttp.onreadystatechange = handleStateChange; xmlHttp.open("HEAD", url, true);
xmlHttp.send(null); } function handleStateChange() { if(xmlHttp.readyState == 4) { if(requestType == "allResponseHeaders") { getAllResponseHeaders(); }
else if(requestType == "lastModified") { getLastModified();
}
else if(requestType == "isResourceAvailable") { getIsResourceAvailable(); } } } function getAllResponseHeaders() { alert(xmlHttp.getAllResponseHeaders()); } function getLastModified() {
alert("Last Modified: " + xmlHttp.getResponseHeader("Last-Modified")); }
function getIsResourceAvailable() { if(xmlHttp.status == 200) { alert("Successful response"); } else if(xmlHttp.status == 404) { alert("Resource is unavailable"); } else {
alert("Unexpected response status: " + xmlHttp.status); }
}
</script> </head>
<body>
<h1>Reading Response Headers</h1>
<a href="javascript:doHeadRequest('allResponseHeaders',
'readingResponseHeaders.xml');">Read All Response Headers</a>
<br/>
<a href="javascript:doHeadRequest('lastModified',
'readingResponseHeaders.xml');">Get Last Modified Date</a>
<br/>
<a href="javascript:doHeadRequest('isResourceAvailable',
'readingResponseHeaders.xml');">Read Available Resource</a>
<br/>
<a href="javascript:doHeadRequest('isResourceAvailable',
'not-available.xml');">Read Unavailable Resource</a>
</body> </html>
The first link on the page demonstrates the XMLHttpRequest object’s
getAllResponseHeaders()method. This method simply retrieves all the response headers as a string. In this example, the response headers are displayed in an alert box. ThegetAllResponseHeaders()method may be of limited value because it returns all the response headers together as a string. Retrieving a single response header using the
getAllResponseHeaders()method requires parsing the returned string to find the single response header in which you’re interested.
The getResponseHeadermethod solves this problem by returning the value for a single response header. This method takes a single string argument representing the name of the response header for which the value is desired. This example uses the getResponseHeader
method to display the Last-Modifiedheader in an alert box. A real-world application of the
getResponseHeadermethod would be to poll a server resource at certain intervals. The browser would try to update its content from the server resource only if the Last-Modifiedresponse header had changed from the last time the server resource was polled.
The last two links on the page utilize the XMLHttpRequest object’s ability to inspect the HTTP status code returned by the server. The XMLHttpRequest object’s status method returns the HTTP status code as an integer. A status code of 200 indicates a normal, successful server response. A status code of 500, conversely, indicates that some kind of internal error occurred while the server was attempting to fulfill the request.
This example uses the HTTP status code to determine whether a server resource is avail- able. The HTTP status code 404 indicates that the requested resource is not available. The “Read Available Resource” link on the page requests a simple XML file residing on the server. Because the file is available, the HTTP status code is 200, indicating a successful response. The last link on the page, labeled “Read Unavailable Resource,” requests a file that does not reside on the server. The server responds with an HTTP status code of 404. The JavaScript event handler inspects the server response, sees the 404 status code, and displays an alert box indicating that the requested resource is not available.
Listing 4-4 shows readingResponseHeaders.xml.
Listing 4-4.readingResponseHeaders.xml <?xml version="1.0" encoding="UTF-8"?>
<readingResponseHeaders>
</readingResponseHeaders>
Figure 4-3 shows the result of displaying all the response headers, Figure 4-4 shows the result of reading the Last-Modifiedheader, and Figure 4-5 shows the result of determining whether a Web resource is available.