zeroliu
zeroliu

Reputation: 1040

Chrome keeps loading a old cache of my website

I am experiencing this weird issue where my Chrome browser keeps loading a old version of my website whose code doesn't even exist on my server any more. I assume it's a typical cache issue.

I tried to clean the browser cache, use igcognito mode, and clean DNS cache. The old cached page is still being loaded.

This issue seems to have been discussing on this google group for three years but there is still no solutions. https://productforums.google.com/forum/#!topic/chrome/xR-6YAkcASQ

Using firefox or any other web browsers works perfectly.

It doesn't just happen to me. All my coworkers experience the same issue on my website.

Upvotes: 60

Views: 93655

Answers (11)

MandyShaw
MandyShaw

Reputation: 1156

I had this problem moving a Wordpress site to new hosting where the URL redirects to .../wp, which hadn't been the case before.

Chrome was helpfully presenting a directory listing showing the file dates from the old server, despite the DNS having updated fully a week ago. So it was obviously demonstrating the problem discussed here.

I added an index.html file with just the following in it:

<meta http-equiv="refresh" content="0; URL='http://my-wp-site.com/wp'"/>

which fixed the problem straight away, including on Chrome browsers that had not had their cache cleared and that had no knowledge of any Google account of mine.

I don't know why this worked, however, given all the problems people have listed above.

Upvotes: 0

DigitalJedi
DigitalJedi

Reputation: 1651

I came across this issue developing locally, and tried the following things:

  1. Clearing Cache + generally ALL files in Chrome
  2. Setting the Cache-Control Header like Eli Duhon mentioned.
  3. Setting the Cache Control Header in multiple other ways.

And the only thing that fixed the problem for me was to basically re-start my docker containers on which the app was running.

so I did this:

docker-compose down

And then

docker-compose up

and everything was updated after that.

HOWEVER, if you have changes again, they are still not updated...

So this is certainly not a fix to this problem, as I dont even know what causes this behaviour in the first place, but I assume it has to do something with hot reloading and/or Docker but that was the only thing that did the trick for me so I thought I would mention it here...

Upvotes: 0

Nisha Ankit
Nisha Ankit

Reputation: 163

Adding CNAME Will help also if you always run site without www, try with www.example.com will work.

Upvotes: 1

V.G.
V.G.

Reputation: 1

You should be able to clear the problem by resetting Chrome. This is the only way I found to clear this condition - after tearing my hair out for half a day.

Prior to finding this, I tried clearing the cache, deleting the contents of the various cache directories etc. in vain.

[As of today May 3 2021] You can do this by gong to 'Settings > Advanced > Reset and clean up > Restore settings to their original defaults'. Note that this will not remove any bookmarks but will log you out of all accounts you are signed into.

Upvotes: 0

Caffeine Coder
Caffeine Coder

Reputation: 1146

I ran into the same issue, and I also tried to disable caching on my JSP pages

<% response.setHeader("Cache-Control","no-cache");
   response.setHeader("Pragma","no-cache");
   response.setDateHeader ("Expires", 0); %>

But it didn't help.

This is a known issue with google chrome and chromium browsers, even though you clear cache and cookie.

However it may or may not happen for most of the users.

Also this has been unresolved till the date since last 9-10 years.

Hence for testing purposes I would highly recommend to use Mozilla Firefox or Opera.

However it does sounds that your application is limited to certain browsers for best experience, and may not sound convincing to Business/End users.

But having said that, this caching issue may or may not happen to most of us.

Upvotes: 0

TheScripterX
TheScripterX

Reputation: 288

I'm not sure if I understand your problem correctly, but I was experiencing something similar and instead of clearing the cache I disabled it by doing this: Open chrome and then go to your website Press Command + Option + C(Mac) Now that you've opened chrome's DevTools, go to the main menu where it says: Elements Console Sources ... Click on the menu element that says Network Make sure that the "Disable Cache" checkbox is checked Then reload the page without closing the DevTools This worked for me. Let me know if it worked for you :)

Upvotes: 12

hariszaman
hariszaman

Reputation: 8424

you have two options

a) consider fingerprint the stale resources like

 <script src="js/app-4829382839238882882bb3442bbbbdhh3kh3.js" type="text/javascript"></script>

b) Add cache control headers such as Cache-Control, Expires on your webserver.

This is a good read on browser caching

Upvotes: -2

Dragomir Andrei
Dragomir Andrei

Reputation: 25

You can press on Inspect, then Network and check Disable cache.

Upvotes: 0

a dubois
a dubois

Reputation: 51

A short term fix to view the new version of your site would normally be to clear out the cache and reload, for some reason this doesn't always work on Chrome. This short term solution is not going to fix the problem for every user that's on your site though, it will just allow you to see the new version of your site.

Adding version numbers to CSS and JS files will allow you and every other user, to see the most recent version of your site. A version number will force any browser not to load from the a user's personal computer cache, and instead load the actual files on the server, if the version number varies from the one in the user's cache.

So if you have these files on your server:

ExJS.js
ExCSS.css

and change them to:

ExJS.js?v=1.01
ExCSS.css?v=1.01

the new version of these files will load in any browser.

Normally, a browser will always load the HTML file from the server, but there are some HTML meta tags you can use to make sure that the most recent HTML version will load for any user:

<meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate" />
<meta http-equiv="Pragma" content="no-cache" />
<meta http-equiv="Expires" content="0" />

There are also ways to make sure that files in other languages always load the most recent version as well, which is discussed on this post:

How to add version number to HTML file (not only to css and js files)

Upvotes: 3

Shruti
Shruti

Reputation: 721

change the name of images and make the necessary image name changes in html file.. found this quick fix for my website

Upvotes: 0

Eli Duhon
Eli Duhon

Reputation: 179

<?php Header("Cache-Control: max-age=3000, must-revalidate"); ?>

You can implement a PHP script that must be the first line of code in your index file . It is an http header typically issued by web servers. You can also rename the resource that is considered "stale". This tutorial will give you more details. https://www.mnot.net/cache_docs/

Upvotes: 17

Related Questions