XMLHttpRequest object - All Request, All The Time

All Request, All The Time

by Paul Adams 22 April 2005

Page 1
JavaScript has had the XMLHttpRequest object for a few years now, but it's really only started getting wide attention recently, due to some showoff web applications that make every developer who sees them think, "I want my site to do that!"

A few high-profile Google applications in particular made a splash with it: Suggest, and Maps, and Gmail. Now it has become a buzzword, and may even be the first JavaScript object with its own fan website. Date.com doesn't count, although I did have a scintillating chat with a lady there once about the getTimeZoneoffset method.

So what is this fancy object that everybody wants a piece of? In brief, it's a solution to one of the big annoyances of web interfaces. Generally, the user inputs some data or makes a choice, and clicks a button that sends the data to the server. The server takes a look at the data and sends back a whole new web page, which is loaded into the browser. Reloading a page every time you want to do something is annoying, disjunctive and time-consuming for the user.

XMLHttpRequest (I'm going to call it XHR, which sounds nice and high tech) moves that browser-server interaction to behind the scenes, so the user can just keep on playing with the same page, even while elements on the page are talking to the server! Go take a look at Google Suggest if I've lost you — it's a nice, eloquent example of this.

JavaScript has always been able to sneakily trigger a server-side script without anything happening in the browser by using a few classic tricks. This one, for example: onSubmit='runascript = new Image(); runascript.src="myscript.php?" + this.value'. That sort of chicanery is good, maybe, for caching form data to a file on the server, but it doesn't return any information to the JavaScript that calls it, so its usefulness is limited. XHR, on the other hand, can get a full parcel of data back from the script it calls. Hence the "XML" part of the name — which really is just there for looks, kind of like the "Java" part of Javascript, because the returned data can be plain text or whatever you like, if XML is overkill or just not your cup of tea.

This opens up millions of exciting possibilities. Every form submission, every JavaScript event, and heaven knows what else, can now interact with server-side databases and processing power. Data retrieval, password authentication, image generation — you name it, XHR can trigger it. AdaptivePath.com calls this sort of asynchronized application Ajax, which is a spiffy, spiffy name. Look for it.
next page» (go the full original peice)