Prevent CSS and content caching

When you’re developing a website there can be lots of little changes, and with each of these a refresh – but what if the CSS does not refresh? What if you’re stuck behind a corporate network which caches in a proxy?

Well the answer is quite simple, and is a common practice already with CSS version control – only this time you use a time stamp to the ensure the CSS is updated on refresh.

Normally when you call your css you would add a faux query to your CSS to note the version and to ensure that if you update the version a repeat visitor will get the new CSS. For example,

style.css?version=3.2

If someone visits your website, style.css is cached by their browser. If they return and the query has changed, for example to version=3.3 style.css is downloaded again.

So what we need to do is ensure that the query, the bit after the question mark always changes.

So how do you do this? Assuming you’re working with PHP, here’s what it will look like:

<link rel="stylesheet" type="text/css" href="style.css?<?php echo date('l jS of F Y h:i:s A'); ?>" />

The same trick can be used in web addresses. If you’re finding the proxy service in your corporate network is a little too persistent with the caching you can add a faux query to force the latest version of the content. Simply add ?1=1 to the end of the address, for example www.itsupportguides.com/?1=1.

 

Note: this is for web development – not recommended for a production website.

Reference: http://css-tricks.com/can-we-prevent-css-caching