I have an angular application and when I open a route, after a release had been made, I will get a broken page. This is because, the main html page would be retreived from the cache and the JS bundle it is expecting will not be present. The server would deliver a not-found html causing the application to endlessly wait.
I checked the headers we are returning for the html and I am expecting it to expire in 5 mins.
etag: "5f2d6f5b-1b5f" expires: Sun, 09 Aug 2020 16:18:40 GMT cache-control: max-age=300
when I simply refresh the page, everything will start working. Also, I am never able to replicate this issue if I have the developer tools open. Is there any way to check what the browser has in its cache and why it would not expire it? I am on ubuntu.
I dont see this trouble in firefox (proably I use it less frequently). I am expecting my users to also get affected by this. hence trying to understand this in more detail.
This issue was nothing to do with Chrome !! It was with nginx.
Nginx was not setting the same expiry to 200 vs 304 response. When we force chrome a refresh, it sends a regular get and gets a 200 ok response. But when it initiates the get with if-modified-since or If-None-Match then the 304 response comes back with a large cache expiry set as default, as there is no content type in these responses.
For the guys who have come to this question, I am leaving the solution for nginx here.
https://github.com/h5bp/server-configs-nginx/issues/230
Issue reported to nginx and work around suggested there. Here is the final content type based caching recommended.
note the way an entry with empty content type is mapped to off.
# No content
"" off;
This is the path traversed by 304 response and does not cause any trouble now.