jQuery AJAX Cache Problems on IE

Internet Explorer (IE) has this huge need to be different. In my opinion, this have no explanation other than the need to screw some development time :) Here I'll talk about another simple example: AJAX cache.

No other browser, by default, caches AJAX requests... but IE does. So, when you make a second AJAX call with the exact same parameters, IE thinks it's smarter than others and returns the result it has in cache from the first request, and there's no way to make it refresh that cache, not F5, not Ctrl+F5, not even asking politely... nothing!

What we have to do is tell, right on the request, that we don't want the result to be cached. So on a jQuery AJAX request, we would do:

$.ajax(
cache: false,
url: 'http://myurl',
data: {}
);

This will work for this particular request. If you want to expand the scope of this setting to all AJAX requests, you can set it on the global AJAX configuration:

$.ajaxSetup({ cache: false });

From now on, I'll be making this cache setting a "must" on every AJAX call.

Be aware of this...

The theory behind this is that IE uses cache for requests with the exact same signature. So if you change something on the request the cache won't be used. In web there's no maginc, and this thing here is no exception. When a $.ajax have the cache set to false what it does is append a dummy parameter to the query string. The name of the parameter is a single _ (underscore) and the value is a timestamp. This way they are quite sure there's no parameter name collision and that the querystring is always unique. This usually isn't a problem unless you actually already use a parameter _ on your application querystring or if you perform some kind of URL parameters validation uppon request and find an unexpected parameter sitting at the end :)