HTML, XHTML and CSS All-In-One for Dummies - Andy Harris [276]
For this example, I use the GET mechanism to load a file called beast.txt from the server in synchronized mode.
Sending the request and parameters
After you’ve opened a request, you need to pass that request to the server. The send() method performs this task. It also provides you with a mechanism for sending data to the server. This only makes sense if the request is going to a PHP program (or some other program on the server). Because I’m just requesting a regular text document, I send the value null to the server: Chapter 6 of this minibook describes how to work with other kinds of data.
request.send(null);
This is a synchronous connection, so the program pauses here until the server sends the requested file. If the server never responds, the page will hang. (This is exactly why you usually use asynchronous connections.) Because this is just a test program, assume that everything will work okay and motor on.
Returning to the basket analogy, the send() method releases the basket, which floats up to the window. In a synchronous connection, you assume that the basket is filled and comes down automatically. The next step doesn’t happen until the basket is back on earth. (But if something went wrong, the next step may never happen, because the basket will never come back.)
Checking the status
The next line of code doesn’t happen until the server passes some sort of response. Any HTTP request is followed by a numeric code. Normally, your browser checks these codes automatically, and you don’t see them. Occasionally, you run across an HTTP error code, like 404 (file not found) or 500 (internal server error). If the server was able to respond to the request, it passes a status code of 200.
The XMLHttpRequest object has a property called status that returns the HTTP status code. If the status is 200, everything went fine and you can proceed. If the status is some other value, some type of error occurred.
Make sure that the status of the request is successful before you run the code that depends on the request. (Don’t get anything out of the basket unless the entire process worked.)
You can check for all the various status codes if you want, but for this simple example, I’m just ensuring that the status is 200:
if (request.status == 200){
//we got a response
alert(request.responseText);
} else {
//something went wrong
alert(“Error- “ + request.status + “: “ + request.statusText);
} // end if
Fun with HTTP response codes
Just like the post office stamping success/error messages on your envelope, the server sends back status messages with your request. You can see all the possible status codes on the World Wide Web Consortium’s Web site at www.w3.org/Protocols/rfc2616/rfc2616-sec10.html, but the important ones to get you started are as follows:
200 = OK: This is a success code. Everything went okay, and your response has been returned.
400 = Bad Request: This is a client error code. It means that something went wrong on the user side. The request was poorly formed and couldn’t be understood.
404 = Not Found: This is a client error code. The page the user requested doesn’t exist or couldn’t be found.
408 = Request Timeout: This is a client error code. The server gave up on waiting for the user’s computer to finish making its request.
500 = Internal Server Error: This is a server error code. It means that the server had an error and couldn’t fill the request.
The request.status property contains the server response. If this value is 200, I want to do something with the results. In this case, I simply display the text in an alert box. If the request is anything but 200, I use the statusText property to determine what went wrong and pass that information to the user in an alert.
The status property is like looking