CODEWITHSUNDEEP
ajaxinternet-explorercachinghttp-headersbrowser-cache
user1085587
user1085587

Reputation: 21

Clear IE cache when using AJAX without a cache busting querystring, but using http response header

I'm having the classic IE-caches-everything-in-Ajax issue. I have a bit of data that refreshes every minute.

Having researched the forums the solutions boil down to these options (http://stackoverflow.com/questions/5997857/grails-best-way-to-send-cache-headers-with-every-ajax-call):

Unfortunately the obvious querysting or "cache: false" setting will not work for me as the updated data file is hosted on Akamai Netstorage and cannot accept querystrings. I don't want to use POST either.

What I want to do is try send an HTTP response header that specifically forbids IE to cache the request or if anyone else knows another cache busting solution??

Does anyone know how this might be done? Any help would be much appreciated.

Here is my code:

(function ($) {
var timer = 0;
var Browser = {
    Version: function () {
        var version = 999;
        if (navigator.appVersion.indexOf("MSIE") != -1) version = parseFloat(navigator.appVersion.split("MSIE")[1]);
        return version;
    }
}
$.fn.serviceboard = function (options) {
    var settings = { "refresh": 60};

    return this.each(function () {
        if (options) $.extend(settings, options);
        var obj = $(this);
        GetLatesData(obj, settings.refresh);
        if (settings.refresh > 9 && Browser.Version() > 6) {
            timer = setInterval(function () { GetLatestData(obj, settings.refresh) }, settings.refresh * 1000);
        }
    });
};
function GetLatestData(obj, refresh) {
    var _url = "/path/updated-data.htm";
    $.ajax({
        url: _url,
        dataType: "html",
        complete: function () {},
        success: function (data) {  
            obj.empty().append(data);               
            }
        }
    });
}
})(jQuery);

Upvotes: 2

Views: 2556

Answers (2)

MarkCheshire
MarkCheshire

Reputation: 21

This was driving me crazy. I tried many cache busting techniques and setting cache headers. So many of these either did not work or were wild goose chases. The only solution I found which tested to work correctly was setting:

Header Pragma: no-cache

I hope it saves others with IE headaches.

Upvotes: 1

Rick Kuipers
Rick Kuipers

Reputation: 6607

Add a random number to the GET request so that IE will not identify it as "the same" in its cache. This number could be a timestamp:

new Date().getTime()

EDIT perhaps make the requested url:

var _url = "/path/updated-data.htm?" + new Date().getTime()

This shouldn't cause any errors I believe.

EDIT2 Sorry I just read your post a bit better and saw that this is not an option for you.

You say "is hosted on Akamai and cannot accept querystrings" but why not? I've never heard of a page that won't accept an additional: "?blabla", even when it's html.

Upvotes: 2

Related Questions