I have an Angular app already in production, but I've been adding new functionalities that would render the old version obsolete. The current version users are using has a manual way of updating (through a popup), but I know some users just won't update or bother refreshing the page.
My app is under a Nginx configure server with the following settings:
add_header X-Frame-Options SAMEORIGIN;
add_header X-Content-Type-Options nosniff;
add_header X-XSS-Protection "1; mode=block";
server {
listen 80;
server_name mysite.com www.mysite.com;
return 301 https://$server_name$request_uri;
}
server {
listen 8000;
server_name mysite.com www.mysite.com;
root /var/www/mysite-front/dist;
index index.html index.htm;
location / {
expires -1;
try_files $uri $uri/ /index.html;
}
location ~ \.(html)$ {
expires -1;
add_header Pragma "no-cache";
add_header Cache-Control "no-store";
add_header strict-transport-security "max-age=31536000";
add_header X-Frame-Options "SAMEORIGIN";
try_files $uri $uri/ /index.html;
}
location ~ \.(css|htc|less|js|js2|js3|js4)$ {
expires 31536000s;
add_header Pragma "public";
add_header Cache-Control "max-age=31536000, public";
try_files $uri $uri/ /index.html;
}
location ~ /\.ht {
deny all;
}
# add_header Strict-Transport-Security 'max-age=31536000; includeSubDomains; preload';
}
My problem is that regardless if I upload a new version, users that don't update, or refresh, keep seeing the old version. Even if I clear the dist folder on the serve, users can keep using the old version of the app.
What could I do to make old users fetch the app straight from the server instead of them relying on whatever cached version they have?