Quiero usar ServiceWorker de javascript para almacenar en caché un archivo HTML para verlo sin conexión. Pero el problema es que tengo una aplicación Django. y no sé cómo puedo especificar mis archivos de plantilla en service-worker.js.

Especifiqué una URL para service-worker.js en mi urls.py así - path('service-worker.js', (TemplateView.as_view(template_name="menu/service-worker.js", content_type='application/javascript', )), name='service-worker.js')

este es mi archivo de plantilla index.html -

 <script> if('serviceWorker' in navigator) { let registration; const registerServiceWorker = async () => { registration = await navigator.serviceWorker.register("{% url 'service-worker.js' %}"); }; registerServiceWorker(); } </script>

todo funcionando muy bien hasta ahora.

este es mi service-worker.js

 const cacheName = 'my-cache'; const filesToCache = [ "/index.html", ]; self.addEventListener('activate', e => self.clients.claim()); self.addEventListener('install', e => { e.waitUntil( caches.open(cacheName) .then(cache => cache.addAll(filesToCache)) ); }); self.addEventListener('fetch', e => { e.respondWith( caches.match(e.request) .then(response => response ? response : fetch(e.request)) ) });

Recibo este error No Uncaught (in promise) TypeError: Failed to execute 'addAll' on 'Cache': Request failed y sé que esto se debe a que el archivo index.html no se encuentra y devuelve el error 404. pero no tengo idea de cómo debo especificar el archivo de plantilla aquí. ¿Alguien puede ayudarme con cómo debo importar archivos de plantilla en service-worker? o puedo tener algún problema totalmente diferente. ¡Gracias!