0

I am new to web app development so pardon my questions.

I just noticed that a web app I created using create-react-app that has service worker installed, upload it to my server, won't reload the new app after being built when I open it from my local Chrome browser, even though I reload node on my server many times, and hard reload Chrome browser.

I removed the service worker from my app and now Chrome always get the new app.

How do I 'force' service worker to update itself in my app so I always get the new build app every time I push it to my server?

If I have to add this Cache-Control: no-cache or other cache mechanism https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Cache-Control what's the use of service worker then?

Eko Andri
  • 181
  • 2
  • 5
  • 17

1 Answers1

0

The ideal solution would disallow installing Service worker if in Dev mode. For your development workflow, you always want your new code without the caching side-effects of service-workers. You can do this by doing something like -

if ( process.env.NODE_ENV === "PRODUCTION") {
  // service worker init code
}

Also make sure to set NODE_ENV=PRODUCTION or NODE_ENV=DEVELOPMENT for your respective prod and dev scripts.

Hope this helps!

Updates

A few project to help you with the sw lifecycle -

  1. sw-toolbox
  2. offline-plugin
Shobhit Chittora
  • 1,209
  • 8
  • 13
  • Yeah I do that. Sorry maybe my explanation isn't clear. When I build and deploy it to my production server, the internet, it still show the outdated app. That's why I have to remove the service worker from my code so it shows the latest app. – Eko Andri Jun 27 '18 at 08:50
  • Hey Eko! Do take a look at this answer on SO - https://stackoverflow.com/questions/33262385/service-worker-force-update-of-new-assets. I think is what you're looking for. – Shobhit Chittora Jun 27 '18 at 09:06
  • Thank you, it doesn't answer my question but clears my confusion of how to use service worker with the best practice possible. – Eko Andri Jun 27 '18 at 09:08