Friday 26 June 2015

Forcing browsers to clear cache

When updating Production environments, there is usually an issue with browser cache. Some styles (css) are modified and you need to manually clear cache in your browser to check the result. This is fine for developers, but what about users? Are you going to tell all the users of a public website to manually clear browser cache?

This problem could be solved by disabling caching of the pages, in the page header or even in the template header, the following line can be added and browsers would not cache anything:

<META HTTP-EQUIV="CACHE-CONTROL" CONTENT="NO-CACHE">

However, an Oracle WebCenter application, as many others nowadays, relies heavily on cache to speed up loading processes, so this approach does not seem to be the best one.

My recommendation is to add a version parameter to the css file reference. Navigate to the place where the css include is located, usually in the page template, and add the following text: ?ver=1.1 The version value could be any of your choice.

For instance, in the WebCenter template file, the following line would force the client browsers to clear cache with the new modifications:

   <af:resource type="css" source="/../shared/css/portal/main.css?ver=1.1"/>

Next time the page is loaded in browser, it will load a new version of the style classes. This may checked using Firebug.



The best part is that you will not need to update the name of the css files, just ensure that include statements are updated when css are changed: 1.1, 1.2, 1.3, etc. It could also be applied to javascript files.

References