Sé que puedo usar el cambio de estado para escuchar el estado instalado y luego pedirle al usuario que vea si desea actualizar.
Esto funciona muy bien siempre que el usuario diga SÍ en ese momento. Pero cuando el usuario dice que no o, por alguna razón, presiona el F5 para volver a cargar la página, no parece haber ninguna forma de verificar nuevamente para ver si hay una actualización en espera.
Estoy más interesado en hacer una verificación rápida justo después de que se cargue la página para ver si hay una actualización en espera y, si es necesario, volver a preguntar al usuario. El evento instalado no se activa en una recarga de página que obliga al usuario a cerrar el navegador y abrirlo nuevamente para instalar la actualización. Siento que me falta algo.
¡Gracias!
2 respuestas
El truco consiste en preguntarle a ServiceWorkerRegistration sobre el trabajador en espera justo después del proceso de registro. Lo que conseguí para mí fue un código como este ...
En el alcance global de mi script que registra al Service Worker, creé una variable y una función para poder conectarme con el nuevo trabajador y preguntarle al usuario sobre la actualización.
var newWorker;
function promptToUpgrade()
{
if(confirm('Upgrade to new version?'))
{
newWorker.postMessage("skipWaiting");
}
}
En la función window.load del mismo script, almaceno la conexión con el trabajador en espera y, si no es NULL, llamo a mi función de solicitud.
navigator.serviceWorker.register('./sw.js',{'scope':'./'}).then(function(reg) {
newWorker=reg.waiting;
if(newWorker) promptToUpgrade();
En el Service Worker mismo, tengo varias funciones que el cliente podría llamar para hacer que el trabajador realice varias tareas. Una de esas tareas es omitir la espera y activar el nuevo trabajador. Este ejemplo solo muestra una tarea.
self.addEventListener("message", function(event) {
switch(data)
{
case 'skipWaiting':
self.skipWaiting();
break;
}
});
También llamo a la función promptToUpdate cuando se detecta el nuevo trabajador agregando un agente de escucha en el proceso de registro para el evento updatefound . Así ha sido todo el tiempo. Pero esto solo se dispara cuando el nuevo trabajador se instala por primera vez y luego nunca más. El código anterior me permite verificar al inicio del proceso de registro y luego llamar al promptToUpdate nuevamente cada vez que se vuelve a cargar la página.
El evento de instalación del trabajador de servicio se emite solo cuando se instala un nuevo trabajador de servicio y se activa el evento de activación cuando se activa el trabajador de servicio instalado.
self.addEventListener('install',function(e){
e.preventDefault();
console.log('install')
localStorage.setItem('ServiceWorkerWaitingForInstall','true');
});
self.addEventListener('activate',function(e){
e.preventDefault();
console.log('activate')
localStorage.setItem('ServiceWorkerWaitingForInstall','false');
});
Puede verificar si el nuevo trabajador de servicio espera ser actualizado o no formarse llamando
localStorage.getItem('ServiceWorkerWaitingForInstall');
Preguntas relacionadas
Nuevas preguntas
service-worker
Un trabajador de servicio es un código JavaScript que, una vez registrado con un origen y alcance asociados, responderá a eventos iniciados por el navegador, incluso cuando las páginas que controla ya no estén abiertas. Al manejar eventos `fetch`, los trabajadores del servicio pueden proporcionar un comportamiento de red personalizado, como soporte fuera de línea (a través de la API de caché). Al manejar eventos `push`, los trabajadores de servicio pueden" despertarse "y mostrar notificaciones.
En Español