Estoy tratando de informar al usuario que la aplicación se actualiza después de instalar el nuevo trabajador de servicio. Pero el problema es que después de hacer los típicos skipWaiting() y ClientsClaim() y tratar de enviar un mensaje a los clientes de que hay una actualización, la matriz de clients está vacía.
índice.js
serviceWorkerRegistration.Register();serviceWorkerRegistration.js
function registerValidSW(swUrl, config) { navigator.serviceWorker .register(swUrl) .then(registration => { registration.onupdatefound = () => { const installingWorker = registration.installing; if (installingWorker == null) { return; } installingWorker.onstatechange = () => { if (installingWorker.state === "installed") { if (navigator.serviceWorker.controller) { // here workbox sends message to service-worker.js registration.waiting.postMessage({ type: "SKIP_WAITING" }); if (config && config.onUpdate) { config.onUpdate(registration); } } else { if (config && config.onSuccess) { config.onSuccess(registration); } } } }; }; }) .catch(error => { console.error("Error during service worker registration:", error); }); }trabajador-servicio.js
self.addEventListener("message", event => { if (event.data && event.data.type === "SKIP_WAITING") { skipWaiting(); clientsClaim(); //clients array is empty here self.clients.matchAll().then(clients => { clients.forEach(client => { client.postMessage("reload-window"); }); }); } }); La matriz de clientes está vacía en service-worker.js , siendo ese el caso, no puedo comunicarme con el usuario.
(También configuré notificaciones con este trabajador de servicio, la matriz de Clientes no está vacía allí, como resultado, no tengo problemas para comunicarme con el usuario)
Cualquier ayuda es muy apreciada.
Pude reproducir el problema.
Debería haber estado haciendo esta parte:
self.clients.matchAll().then(clients => { clients.forEach(client => { client.postMessage("reload-window"); }); }); mientras escucha activate un evento como este:
self.addEventListener("activate", () => { self.clients.matchAll().then(clients => { clients.forEach(client => { client.postMessage("reload-window"); }); }); });