7

We have a problem with chrome cache whenever we release a new version of our site, we searched for days and added/removed any header, meta-tags, nginx config, etc which may cause this problem, or is said to fix it, but nothing changed yet. the index.html is still getting cached and we have to press F5 to see the new changes on random computers,

The site is implemented as an SPA, using angularjs framework and is hosted using ngnix which is behind a traefik proxy, using traefik rules, we force redirect HTTP requests to HTTPS by 301 response.

today I found the failing scenario! if a user enters the https protocol in the address bar (e.g. https://example.com), everything is working correctly but if the user comes back and tries to visit http://example.com, chrome will redirect the user to https via 301 redirect cache, then loads a cached version of index.html which is not what we want, it is ok that 301 redirect is cached, but we want chrome to get the index.html from server not loading it from disk cache!

Note: as long as a user is using HTTPS, the index is loaded from the server or gets 304 response, we want this to happen when the user enters just the domain itself, not with https.

this is meta tags which are added to index.html:

<meta http-equiv="cache-control" content="max-age=0" />
<meta http-equiv="cache-control" content="no-cache" />
<meta http-equiv="expires" content="0" />
<meta http-equiv="pragma" content="no-cache" />

and here is part of our nginx config:

...
http {
    ...
    proxy_cache_path /var/nginx/cache levels=1:2 keys_zone=prerender_cache:100m max_size=10g inactive=1d;
    proxy_cache_key "$request_method$host$request_uri$is_args$args";
    ...
    server {
        access_log /dev/stdout combined1;
        listen      80 default_server;
        server_name example.com;
        root /app;
        index  index.html;
        ...
        location ~ ^/(assets|static|styles) {
            expires     31d;
            add_header  Cache-Control public;
        }
        location @asset_pass {
            root app/;
            try_files $uri =404;
        }
        location / {
            expires -1;
            add_header Pragma "no-cache";
            add_header Cache-Control "no-store, no-cache, must-revalicate, post-check=0 pre-check=0";
            try_files $uri @prerender;
            autoindex on;
        }
        location ~ \.html$ {
            expires -1;
            add_header Pragma "no-cache";
            add_header Cache-Control "no-store, no-cache, must-revalicate, post-check=0 pre-check=0";
        }
    }
}

Now the question is: is there any way to fix this or this is the default behavior of google chrome?

Thank you all for taking the time to read this question and sorry if it was too long.

M-N
  • 300
  • 2
  • 14
  • Here is a link to a wuestion that might help: https://stackoverflow.com/questions/38196452/disabling-angularjs-http-cache – IBirle Jan 05 '19 at 07:59
  • @IBirle thanks for the link, but we prefer a non-js way for solving this, if we decide to go with js, we can implement a force-reload feature which checks the latest front version from the backend. – M-N Jan 05 '19 at 08:05
  • Did you find any way? @M-N – Anu Sep 24 '19 at 10:05
  • @A.Anwin Unfortunately no, we used the method described in my previous comment as a temp fix. – M-N Sep 24 '19 at 11:54

1 Answers1

0

You can try to touch your index.html file, then response header last-modified will changed to latest date time, so browser will consider this resource to be 'outdated', latest 301 rule will be applied;

zmou-d
  • 834
  • 1
  • 8
  • 14
  • 1
    we are already doing this, we create new index.html either, as I mentioned in my question, unfortunately, Chrome won't send a request to the server in specific scenario, and loads data from local cache. so this won't work. – M-N Nov 09 '19 at 09:27