0

I have a problem with updating the CSS stylesheet on my website.

I'm using nodejs and express as a server. When updating the CSS code I want it to automatically use the new style. I do this by giving the CSS file a version number eg ?v=3'

<link rel='stylesheet' href='/stylesheets/style.css?v=3'/>

When the new version of the website is deployed (with the updated stylsheet),it still shjows the previous CSS style even though the CSS version in the HTML refers to the newest version. (When looking in the source code (CTRL+U))

I also purged Cache from Cloudflare and put it on developer mode, this doesnt make a change.

When opening a incognito tab the style is updated.

How can I fix this issue?

TylerH
  • 20,799
  • 66
  • 75
  • 101
jamep37912
  • 27
  • 4
  • 1
    I think the file is cached on browser try clearing cache or try wit `ctrl+f5`. this question is already asked here. https://stackoverflow.com/questions/2263096/css-file-not-refreshing-in-browser – saitama May 31 '21 at 17:30
  • above suggestion is relevant also try updating version e.g. style.css?v=3 to style.css?v=3.0 or something it would force browser to refetch new file ...at least this is how browsers suppose to work. – Syed May 31 '21 at 17:32
  • Hi Syed and cedverd. Hi prximo0 thanks you for your answer! I update the version of the CSS. I have put cloudflare on development mode, purged the cache and it's respects existing headers. Anything that I could have missed? I it still not displaying the updated stylesheet, even though de html requests the correct css version. I even compared the stylesheet that was requested to the one the one in my code editor en there are no differences – jamep37912 Jun 01 '21 at 17:06

1 Answers1

0

As other have mentioned, typically you would do this by busting the cache (browser cache) by appending a new string. So, as you have stated updating the querystring param will typically grab the new file, however reading your question you mention 'Cloudflare'.

This would indicate you have a CDN in front of your website, so you have an extra layer that may or maynot honor querystrings. If you have your CDN configured to cache the entire string (including querystrings) then it should work. However if you don't then Cloudflare will only take the main request and not look at the querystring variables.

proxim0
  • 1,418
  • 2
  • 11
  • 14
  • Hi prximo0 thanks you for your answer! I have put cloudflare on development mode, purged the cache and it's respects existing headers. Anything that I could have missed? I it still not displaying the updated stylesheet, even though de html requests the correct css version. I even compared the stylesheet that was requested to the one the one in my code editor en there are no differences. – jamep37912 Jun 01 '21 at 17:01
  • If you hit the CSS directly on your server (bypass cloudflare) is it showing up? I have seen instances where CDN's will not purge correctly at times. Also, do you have a URL to see this in action? – proxim0 Jun 02 '21 at 14:33