Introduction

XMLHttpRequest is a JavaScript object used to send HTTP or HTTPS requests directly to web servers in order to submit or retrieve information in the background.

XMLHttpRequest is an integral element of “Asynchronous JavaScript and XML” web development technique, commonly known as AJAX, which is used to implement dynamic and responsive web applications. Examples of these web applications include Facebook, Gmail, Google Map.

Background

XMLHttpRequest object was originally created by Microsoft in 1999 as part of its Exchange Server 2000 program. The object was designed to simulate the highly interactive user-interface of Microsoft Outlook while being exclusively based on a web browser.  Later it was sowed into Internet Explorer 5.0 and became a resounding success.

In 2002, Mozilla Foundation introduced a browser that provided JavaScript object compatible with Microsoft XMLHttpRequest; thus paving the way for XMLHttpRequest object to become a de facto standard amongst other agents.

In 2004, Google launched Gmail. The new mail service relied heavily on XMLHttpRequests and asynchronous web techniques, and unlike Microsoft Outlook Web Access, was a FREE web application with multiple browser compatibility. It was during this time that asynchronous technologies stated to establish themselves as an important element of internet.

In 2005, Jesse James Garret, the famous technology product designer, coined the acronym AJAX - Asynchronous JavaScript XML, which referred to techniques being used by web applications to send and retrieve information from web servers using background HTTP requests. In 2006, the World Wide Web Consortium (W3C) released the first draft specification for XMLHttpRequest objects in order create an official web standard.

Troubles with XMLHttpRequest

For the past 10 years XMLHttpRequest has been the principle tool of delivering efficient and interactive web applications that work across most popular browsers.
Despite its success, the application suffers from some very basic flaws. For instance XMLHttpRequest lacks coherent cross-browser solutions which enable retrieval of multiple responses from HTTP server to the same AJAX request. This capability, commonly known as COMET or server push, is essential for increasing the efficiency and effectiveness of web operations. There are indeed ways to implement COMET using XMLHttpRequest (e.g. by adding conditional codes), but all these solutions rely on using multipart responses depending on browser type and version.

The above issue coupled with XMLHttpRequest’s inability to upload files or communicate with the different domain names lead engineers to propose “improvements” to the old application. So XMLHttpRequest Level 2 was designed.

Enter XMLHttpRequest Level 2

XMLHttpRequest Level 2 is a “proposed” upgrading of XMLHttpRequest specification which promises to iron-out some of the core problems of the earlier version. The three most interesting improvements offered by the new specification are:

File uploading

In XMLHttpRequest, users were not allowed to upload files directly from their machines. Developers had to prepare the entire HTTP request with the contents of the file for upload. In JavaScript there were no provisions available to access the actual contents of the files, as it was considered a security risk.

Unlike JavaScript however, HTML5 specification supports form file input. The application is called “files API” in HTML5 specification, and allows users to examine contents of one or more files.   Furthermore HTML5 specification also supports drag and drop facilitation, whereby, users can drag file directly from their desktop onto their browsers. The feature provides information about the object being dragged, and enables JavaScript to inspect/read the date via the “files” application.

 
The “send” function on XMLHttpRequest Level 2 object takes the parameter of a “file” or “blob” object. The object can then be called and read by XMLHttpRequest and send progressively to the server. The data is served piecemeal so that the user’s computer does not run out of memory in case of a large file.  

Tracking progress

XMLHttpRequest Level 2 supports multiple events that can be triggered on different occasions. One of these occurs when HTTP request data is sent to or received from the server. XMLHttpRequest Level 2 enables users to monitor the progress of incoming and outgoing date, with an estimated finish time display.  

Cross-domain AJAX requests

XMLHttpRequest could only send or receive data to URLs with the name similar to the one in which the browser document XMLHttpRequest object was created. This was a default feature of XMLHttpRequest, and was designed primarily to guard against malicious scripts which could exploit the situation to execute a cross-site scripting attack.   

However with new development, especially with regards to browsers that support Cross Origin Resource Sharing, the same domain restriction applied by XMLHttpRequest object has been overcome. The tool defines headers that control whether the HTTP requests can be sent to other domains or not. This flexibility will enable developers to implement AJAX applications using Web services provided by different sites.

Conclusion

XMLHttpRequest Level 2, just like Cross Origin Resource Sharing, File API and HTML5, is designed to simplify a web developer’s life, and to accelerate the process of development. Unfortunately not all browsers are ready to support the new specification. We still have to wait for these specifications to enter the main stream, and even after that there will always be some who will continue to use outdated browsers that do not support newer possibilities.

We can all hope that unlike the initial specification, all browser vendors will unanimously adopt XMLHttpRequest Level 2, and design their products accordingly. Otherwise developers will have to add more conditional codes to detect user browsers (type & version) in order to ensure consistency.