Firefox browser does not reload the update CSS/JS files

Question

I'm having a problem in the firefox browser, because everytime I update my CSS or JS files, I need to clear the cache of my firefox browser to get the updated files. I'm using XSP2 server because I developed my webapp using C# and asp.net in ubuntu.

Is there any way to automatically reload the updated CSS/JS files in the firefox browser and implemented in server-side or in my webapps?

Please advise.

Many thanks.

Nahydrin · Answer 1 · 2011-07-21T04:18:02.880

11

Hold the CTRL button and press F5. It's a hard refresh that clears the cache for the page you just refreshed.

If you want to auto-reload other users browsers, use a random variable on the end of the src/href tag. Like:

<script type="text/javascript" src="dothis.js?r=591"></script>

If the src is always changing, the browser will reload the script without using cache.

edited Jul 21 '11 at 04:18

answered Jul 21 '11 at 01:29

Nahydrin

13,197
12
59
101

pressing `F5` alone also work. It check for new version and load it if modified. Where `Ctrl+F5` will reload all resource regardless they are modified or not. – shashwat Aug 13 '13 at 06:20
Thanks for that great type I was not aware that we could hard refresh the browser. After updating some css files, F5 is not always taking the changes into account. But Ctrl+F5 seems to do the trick every time. – jmbouffard Aug 21 '13 at 12:16

score 3 · Answer 2 · answered Jul 21 '11 at 00:22

3

This is what I use: https://addons.mozilla.org/en-US/firefox/addon/clear-cache-button/

Alternatively, set your cache to use 0 MB: Go to Preferences -> Advanced -> Network -> check override automatic cache management, and set to 0MB.

answered Jul 21 '11 at 00:22

jbeard4

12,664
4
57
67

1

Thanks, but I want other user's browser to automatically reload the udpated files without tweaking their browser. – domlao Jul 21 '11 at 00:25

score 2 · Accepted Answer · answered Jul 21 '11 at 00:38

2

You could mess with the cache of the headers, but the easiest thing to do is simply append your updated elements with a querystring when you want them to change...

I know this doesn't sound like a good solution, but when you begin minifying and combining your js and css files for performance reasons, most of the solutions will change the url to get these resources when they change anyway...

answered Jul 21 '11 at 00:38

ar3

3,883
3
21
22

yeah...again, I know it doesn't sound maintainable, but it is one of the best ways to ensure all browsers won't cache the file... – ar3 Jul 21 '11 at 00:40

score 1 · Answer 4 · edited May 23 '17 at 11:44

There are a couple of ways to make sure the users see the latest content on your web pages. Refresh the pages at certain time intervals or block the browser from caching the web page, each time they return they will load the data fresh.

===== Do not allow the user to store the data in cache at all:

<META HTTP-EQUIV="Pragma" CONTENT="no-cache">

Add this between the and tag and the page will never be cashed in the first place.

===== Refresh the page after a certain time interval:

<meta HTTP-EQUIV="Refresh" CONTENT=300>

Add this between the and tag and the page will never be cashed in the first place.

Another solution : Here

or :

<%@ OutputCache Location="None" VaryByParam="None" %>

source : Here

Firefox browser does not reload the update CSS/JS files

4 Answers4

Linked