service-worker

Quick question for discussion really, as I wanted to have input from different people. I am in the process of developing a web page app that must be available offline. Now to do this, as I understand it, you would go about using either the application caching feature or by using service workers. However, here is the conundrum I have. When researching the application cache, the MDN clearly states : Deprecated: This feature has been removed from the Web standards. Though some browsers may still support it, it is in the process of being dropped. Do not use it in old or new projects. Pages or Web

I'm trying to integrate service workers into my app, but I've found the service worker tries to retrieve cached content even when online, but I want it to prefer the network in these situations. How can I do this? Below is the code I have now, but I don't believe it is working. SW Install code is omitted for brevity. var CACHE_NAME = 'my-cache-v1'; var urlsToCache = [ /* my cached file list */ ]; self.addEventListener('install', function(event) { // Perform install steps event.waitUntil( caches.open(CACHE_NAME) .then(function(cache) { console.log('Opened cache'); return cache.addAll

I've been reading through the html5rocks Introduction to service worker article and have created a basic service worker that caches the page, JS and CSS which works as expected: var CACHE_NAME = 'my-site-cache-v1'; var urlsToCache = [ '/' ]; // Set the callback for the install step self.addEventListener('install', function (event) { // Perform install steps event.waitUntil( caches.open(CACHE_NAME) .then(function(cache) { console.log('Opened cache'); return cache.addAll(urlsToCache); }) ); }); self.addEventListener('fetch', function (event) { event.respondWith( caches.match(event.request) .then

How can I get the full URL of the page which is being serviced by a service worker's 'fetch' event? The "self.location" property seems to only refer to the root URL of the site. For example, if page https://example.com/folder/pagename.html is performing a fetch which the service worker is intercepting, the service worker's 'self.location' property returns " https://example.com ". event.currentTarget.location and event.explicitOriginalTarget.location, event.originalTarget, and event.target all return the URL of the service worker .js file. How can I get the full URL of the page that triggered

MY directories are as follows. public_html/ sw/ The "sw/" is where I want to put all service workers, but then have those service workers with a scope to all the files in "public_html/". JS <script> if ('serviceWorker' in navigator) { navigator.serviceWorker.register('sw/notifications.js', { scope: '../sw/' }).then(function(reg) { // registration worked console.log('Registration succeeded. Scope is ' + reg.scope); }).catch(function(error) { // registration failed console.log('Registration failed with ' + error); }); }; </script> How do I allow this sort of scope? The max scope for a service

I am currently working on service worker to handle push notification in browser. Currently I am having this "SW registration failed error". Can anyone help with this issue? Check client1.html and service-worker.js file below: ERROR: SW registration failed with error SecurityError: Failed to register a ServiceWorker: The URL protocol of the current origin ('null') is not supported. service-worker.js console.log('Started', self); self.addEventListener('install', function(event) { self.skipWaiting(); console.log('Installed', event); }); self.addEventListener('activate', function(event) { console