Ajax cache control

Question

I am having a problem with ajax requests in Internet Explorer and in Chrome - I cannot bust the cache. Normal pages don't have the problem - it's just the ajax requests.

I know that one workaround is to append a random query string variable to the end of the URL. However, I don't want to lose all the benefits of caching, I just want the browser to pick up the new file if the version on the server is different from the cached version.

I have tried manually setting the ajax POST header, to no avail:

xmlHttp.setRequestHeader("Cache-Control", "must-revalidate");

Adding this to my .htaccess file doesn't work either:

<FilesMatch "\.(js|css).*">
Header set Cache-Control: "max-age=172800, public, must-revalidate"
</FilesMatch>

Any help would be greatly appreciated.

Thanks, Brian

Answer 1

What about creating/extending a component that emits your css/js includes with the latest versions appended to the links? This way it's not going to grab a fresh copy every time, and will only grab a new version when the server says there is one.