How to Invalidate Web Browser Cache Content

I know that this is probably apparent, as, you could gather that the "versioning" technique for invalidating cache works for any static resource requested, but in case it is not, I will pipe in here.

We allow branding for some of our applications, and, that means image files very often change during the course of clients' lifetimes with us, as well as other static files previously mentioned. If the same name were to be used for a file, caching would present a problem. Handily, the idea of versioning the source of an image works just as well.

<img src="images/title.gif?v=2" />

Also, it is probably not important to mention this, but, the term "invalidating cache" in this regard, is not technically correct. To invalidate cache is to remove the cache entries. There is no actual way to truly programatically do this for a browser. What we are actually talking about here is asking the web-server for a new file due the name of the file changing, not forceably removing the original file. You can easily test this by changing a file version back and forth between an unused version, and an older used version, and seeing the HTTP 200 and 304 responses respectively.

enter image description here


I'm running into similar issues sometimes that JS and CSS is cached to long. The solution that works for me is, adding an versionnumber or timestamp of the last update to the filename as querystring. This way the browser sees the file as changed and it will download it again.

Could be something like this for getting JS:

http://yourdomain.com/content/js/functions.js?v=201232