I used create-react-app to start working on a React app. By default, it uses service workers. I also happen to serve my production app with https.
It turns out that with this config, my browser just doesn't get new versions I deploy. It keeps on reloading old versions, even if I force a refresh. The only way I can get it to load the latest build is by inspecting the page (with Chrome). Then, when I force-refresh, the latest build is loaded.
I have disabled the service worker as it seemed to be the culprit, but I keep on bumping into this problem. I can't ask my users to each open the inspector in their browsers in order to get the latest build.
How can I find out how to fix this problem? Is there a create-react-app config I could change in order to make sure this does not happen anymore?
I've actually found what the problem was: the index.html was cached, and so it was pointing to old js files which were also cached.
The way I solved it was to add this config to an .htaccess file at the root of the app (although configuring apache through other means might also work):
<FilesMatch "\.(html)$">
FileETag None
<IfModule mod_headers.c>
Header unset ETag
Header set Cache-Control "max-age=0, no-cache, no-store, must-revalidate"
Header set Pragma "no-cache"
Header set Expires "Wed, 11 Jan 1984 05:00:00 GMT"
</IfModule>
</FilesMatch>
In the end, it was unrelated to the service worker. It only had to do with the way index.html was cached.