Dr. Dobb's | Timing Out XMLHttpRequest Calls in IE8

Timing Out XMLHttpRequest Calls in IE8

Get to know the timeout property

February 03, 2009
URL:http://www.drdobbs.com/tools/timing-out-xmlhttprequest-calls-in-ie8/213000935

The XMLHttpRequest (XHR) object is at the foundation of AJAX and a native object in nearly all Web browsers available today. The programming interface of the object is largely based on the first released example of it, which dates back to 1999 when Microsoft released it as an ActiveX control bundled with Internet Explorer 5.

XMLHttpRequest is a de-facto standard, though. A standard specification is still in the works at W3C and the latest working draft was released about one year ago, in the Spring of 2008.

Two key features are not currently comprised in the standard being developed at W3C-- cross-site calls and timeout. Both of them are being discussed a lot and will probably make the way into the official standard pretty soon. In Internet Explorer 8, both of these features find full support. In particular, client-side cross-site calls happen through a new object built from the ground up to make it secure and easy. The object is named XDomainRequest.

As far as the timeout of plain XHR requests is concerned, Internet Explorer 8 also comes to help with a new property -- the timeout property.

Support for timeout during client-side Web calls is so important that it is frankly surprising that only Internet Explorer 8 provides a native support for it. With the timeout property you can specify for how long (in milliseconds) the client has to wait for a response to come before aborting the connection. This simple feature is beneficial in a number of ways and it is especially helpful in relation to the limited number of connections that can exist between the browser and the server. Before Internet Explorer (and Firefox 3) the number of concurrent connections was limited to 2, increased to 6 now. The ability to set a timeout enables the browser to reuse connections more quickly and often. The browser doesn't have to wait for a dead connection but can reuse it after a specified number of milliseconds.

In Internet Explorer 8, you use the timeout property as shown below:


var xhr = new XMLHttpRequest();
xhr.open("GET", url, true);
xhr.timeout = 5000;

The timeout property defaults to 0, meaning that no timeout applies to the request unless you explicitly set it. The timeout property is read/write and affects only the instance of the XHR object it is defined on. It is recommended that you choose the timeout value carefully and opt for a value longer than the ideal maximum response time to make up for unexpected latency. When a request times out, the response is null and this is fully reflected by response properties on XHR such as responseText.

When the request times out, an event is fired to the JavaScript environment for you to handle and instruct the client code on what to do. The event is ontimeout and it is demonstrated below.


var xhr = new XMLHttpRequest();
xhr.open("GET", url, true);
xhr.timeout = 5000;
xhr.ontimeout = onRequestTimeout;
xhr.send( ... );

The timeout callback doesn't get any parameter and it is a mere notification.

It is worth mentioning again that the timeout property is not referred to any standard and is currently only offered by Internet Explorer 8. Is this really a problem? Well, not exactly.

Most of the JavaScript code used in Web sites today is based on client-side libraries such as jQuery and Microsoft AJAX Library. Both libraries fully support timeout in their respective wrappers for the XHR object. The timeout property in Internet Explorer 8 just makes it easier for libraries to implement the feature in future releases. It is a breaking change for developers only if developers are coding AJAX directly against the XHR object -- a not-so-common scenario these day.