Recibo este error al intentar registrar el trabajador del servicio:
No se pudo registrar un ServiceWorker: se recibió un código de respuesta HTTP incorrecto (404) al obtener el script.
Estoy trabajando con ionic y esto es lo que tengo en app.js:
if ('serviceWorker' in navigator) { navigator.serviceWorker.register('service-worker.js').then(function(registration) { console.log('ServiceWorker registration successful with scope: ', registration.scope); }).catch(function(err) { //registration failed :( console.log('ServiceWorker registration failed: ', err); }); }else { console.log('No service-worker on this browser'); }En el directorio, tengo el archivo service-worker.js justo al lado de app.js en la misma carpeta.
Usando la última versión de Chrome en el escritorio de ubuntu.
Menciona que tiene service-worker.js en el mismo directorio que app.js , pero la URL pasada a .register() es relativa a la ruta del documento HTML. Debe asegurarse de que su archivo service-worker.js esté en el mismo directorio que el archivo .html correspondiente a la página en la que se encuentra.
El documento HTML que intenta registrar un trabajador de servicio y SW.js deben estar en el mismo directorio.
Estas son excelentes respuestas y ayudaron con mi confusión. Solo quería agregar otra cosa en caso de que otros se encuentren con este problema y estén confundidos como yo.
Si está utilizando un paquete como Webpack, la ruta debe ser relativa a la versión compilada.
Si su sw.js está en la carpeta /src pero la versión compilada de su html va a una carpeta ./dist y su ruta para registrar el sw.js es "./sw.js" , el trabajador del servicio estará buscando en la carpeta dist para el archivo sw.js.
Mi solución al problema anterior para Webpack es usar copy-webpack-plugin y enviar el archivo desde la carpeta src a la carpeta dist.