How to force cache/browser data clearing in browser?

Question

Scenario: I have upgraded an old Joomla! website from 2.5 to the latest version of Joomla!. After doing so the site from my point of view looks as it should. If I try to access the site from another pc that has previously accessed the site before the upgrade, the CSS looks to be obsolete.

Solution: In order fix that, I clear the cache and any browsing data through the browser and the issues are fixed.

Prevention measures: I have looked at my custom components and I do not have cache saving mechanism in place, so I guess this is a browser side issue. The question is, how do I prevent this from happening in the future?

Reasoning: If my previous users access the site everything will look bad and I cannot expect them to know that they have to refresh their cache.

Research:

I've looked at Joomla versioning (https://www.joomlart.com/tutorials/joomla-tutorials/tutorial-how-to-enable-content-versioning-in-joomla-site)

I've looked at cache clearing (https://forum.joomla.org/viewtopic.php?t=949662)

Nothing seems to be a concrete solution.

If there is a "best practice" for these kinds of situations please do share I would be delighted to learn all about it.

Answer 1

I have faced the very same problem many, many times. In the meantime I have learned that one can force browser to clear its cache only by versioning assets loading. So you need to find where your template loads its CSS files, and to add at the very end of loading command some type of versioning string, something like "?v=xxx". Once the browser caches previous version string, you can easily force it to reload that asset by simply changing version number by increasing it.

That is only "best practice" I know of. There is no system plugin so far which can automate this procedure, so you will have to do it manually by editing corresponding template's .php file which loads it's assets (usually some kind of index.php).

The very same trick can be used for reloading .js files too, but they are not part of your question and concern.

Answer 2

You can use mediaVersion. There are a few ways to do that. Look into those 2:

Manually adding version to loaded files: $v = JFactory::getDocument()->getMediaVersion()

JHtml versioning of loaded files:

// Add script
JHtml::_('script', 'xxx.js', array('version' => 'auto'));
// Add Stylesheets
JHtml::_('stylesheet', 'xxx.css', array('version' => 'auto'));

Answer 3

The only way to reliably bust the cache of client browsers is to change the name of the asset in question; forcing all browsers to download it.

Answer 4

You can use JCH Optimize to combine and optimize the delivering of all the script files - CSS and Java. Each combined file gets a new name, when you clear the cache in the plugin.

I always use the PRO version, which is extremely effective and worth all the money.

Answer 5

Add the timestamp of the file as parameter so that the file will not be cached.

$mtime = filemtime('/path/to/script/script.js');
JFactory::getDocument()->addScript('/url/of/script/script.js?t='.$mtime);

Answer 6

For me the problem was the text that I was using . It wasn't registering changes to the css file and that has nothing to do with the cache . You only need to change the text editor