0

I am working on a website with PHP in backend and AngularJS in frontend. and it's served via apache2.4. My problem is when I update my website to a new version some users cannot see the latest modifications, so I added this .htaccess to force cleaning the cache every 1 hour, but it doesn't work as I expected.

FileETag None
<ifModule mod_headers.c>
    Header unset ETag
    Header set Cache-Control "max-age=3600, must-revalidate, private" 
</ifModule>

Could you give me the right cache configuration to force the browsers to get the last update whenever a new version is available?

HASNI Faiçal
  • 260
  • 3
  • 18
  • is this CSS and Javascript which is not updating? If so then why don't you rename your files with an incrementing number of each change e.g. `script1.css`. This will force the browser to update to the latest version. – Kitson88 Oct 10 '16 at 14:27
  • @Kitson88 And that is supposed to be a solution? Certainly works, but there is actually a sense in using caches. Otherwise one could simply deny caching and all is fine. – arkascha Oct 10 '16 at 14:29
  • Is the headers module actually loaded? Are you sure? Why? – arkascha Oct 10 '16 at 14:29
  • @arkascha If it was a solution it would be placed in the answer box. It was a suggestion which may overcome the problem which OP is facing. Funnily enough the same suggestion with alot of votes was posted here already: http://stackoverflow.com/questions/1922910/force-browser-to-clear-cache – Kitson88 Oct 10 '16 at 14:32
  • @Kitson88 That is the crudest of all options. Like using a screw with a heavy hammer. Works. Great. Question is: why not solve the issue instead? – arkascha Oct 10 '16 at 14:33
  • @arkascha Enough comments, lets here your solution as you seem to be clued up on this matter. – Kitson88 Oct 10 '16 at 14:35
  • @Kitson88 The obvious solution is to use working cache control. I asked a question to the OP to start finding out what the issue is. That is how one starts to tackle an issue. – arkascha Oct 10 '16 at 14:36
  • 2
    Using a unique version number (or epoch) in the js/css build filename is a very common approach. @RyanAllan 's answer was spot on, not sure why he deleted it. – jszobody Oct 10 '16 at 14:37
  • @jszobody I think it was down-voted by our friend above so he deleted his post to save rep. I would of up-voted if I'd had the chance. – Kitson88 Oct 10 '16 at 14:41
  • @Kitson88 Sorry, but please be very careful with such assumptions. Thanks. – arkascha Oct 10 '16 at 16:25

1 Answers1

2

Within your build process, you could append a query parameter to your static files such as JS / CSS like : app.js?1476109496 (where epoch is a unique reference such as deployment epoch, commit hash or similar) which would cause browsers to request a new version without needing to mess with your .htaccess.

Ryan
  • 1,151
  • 5
  • 7
  • This won't work as a query string as browsers don't always respect this. Better off having the timestamp in the file path. – fire Oct 10 '16 at 14:27
  • @fire, Angular is using the same mechanism for browser cache busting by using the flag **--output-hashing all** when building the project. – HASNI Faiçal Sep 12 '20 at 19:35