How to update service workers?

Question

Situation:

On mywebsite.com/game, I registered a service-worker with

navigator.serviceWorker.register('/service-worker.js', {scope: "/"});

On my server, '/service-worker.js' has a maxAge of 1d.

Problem:

service-worker.js has a major bug. It always displays an empty page and can't fetch anything. service-worker.js must be changed.

The problem is whenever a user goes to mywebsite.com/game, it displays the empty page and does nothing more. I am unable to make the client fetch the new service-worker.js.

How can I make the client fetch the new service-worker.js?

score 15 · Accepted Answer · answered Sep 13 '19 at 14:39

What you're describing—a check for updates to /service-worker.js—happens by default, automatically, under the circumstances laid out in this article:

An update is triggered if any of the following happens:

A navigation to an in-scope page.

A functional events such as push and sync, unless there's been an update check within the previous 24 hours.

Calling .register() only if the service worker URL has changed. However, you should avoid changing the worker URL.

All modern web browsers will ignore any Cache-Control headers you set on /service-worker.js by default and go directly against the web server to obtain the latest copy.

This Stack Overflow answer has some best practices for what the revised service-worker.js file should contain if you want it to behave like a "kill switch."

Last verisions of chromium based browsers don't see any service worker file changes at all, versioning is the only reliable way to be sure that changes will be applied — Alliswell, Nov 03 '21 at 06:21
That's not the intended behavior, and if you're seeing that in Chrome, it's very much a bug. You should provide details at https://crbug.com/new — Jeff Posnick, Nov 03 '21 at 12:42

score 0 · Answer 2 · answered Sep 23 '21 at 10:43

0

Just add ?v=1 to your script like this.

navigator.serviceWorker.register('/service-worker.js?v=1', {scope: "/"});

And increment the number of script version when you make changes of service worker's script

answered Sep 23 '21 at 10:43

andrew_jackson

125
4

This doesn't work if the page is empty because of the previous service-worker.js. – RainingChain Feb 07 '22 at 17:34
7

This is bad practice when it comes to service workers. The uri should always be the same, e.g. '/service-worker.js'. – Max Fahl Apr 29 '22 at 08:00

How to update service workers?

2 Answers2