|
|
|
|
|
|
|
|
'use strict'; |
|
|
'use strict'; |
|
|
|
|
|
|
|
|
// NOTE: CacheKey & FilesToCache Lists |
|
|
// NOTE: CacheKey & FilesToCache Lists |
|
|
const cacheKey = 'omapp-v'; |
|
|
|
|
|
const shellCacheKey = cacheKey + '1'; |
|
|
|
|
|
const logicCasheKey = shellCacheKey + '.' + '0'; |
|
|
|
|
|
const dataCacheKey = logicCasheKey + '.' + '0'; |
|
|
|
|
|
const shellFilesToCache = [ |
|
|
|
|
|
|
|
|
const cacheKey = 'omapp-'; |
|
|
|
|
|
const staticCacheKey = cacheKey + 's-v' + '1'; |
|
|
|
|
|
const dataCacheKey = casheKey + 'd-v' + '1'; |
|
|
|
|
|
const staticFilesToCache = [ |
|
|
'/', |
|
|
'/', |
|
|
'/manifest.json', |
|
|
'/manifest.json', |
|
|
'/index.html', |
|
|
'/index.html', |
|
|
|
|
|
|
|
|
'/lib/vue-router.js', |
|
|
'/lib/vue-router.js', |
|
|
'/style/style.css', |
|
|
'/style/style.css', |
|
|
]; |
|
|
]; |
|
|
const logicFilesToCache = [ |
|
|
|
|
|
'', |
|
|
|
|
|
]; |
|
|
|
|
|
const dataFilesToCache = [ |
|
|
const dataFilesToCache = [ |
|
|
'', |
|
|
'', |
|
|
]; |
|
|
]; |
|
|
|
|
|
|
|
|
// NOTE: Registration done in main.js |
|
|
// NOTE: Registration done in main.js |
|
|
|
|
|
|
|
|
// NOTE: Install and activate: Populating cache |
|
|
// NOTE: Install and activate: Populating cache |
|
|
self.addEventListener('install', function (event) { |
|
|
|
|
|
|
|
|
// Install new service worker even when old version still in use. |
|
|
|
|
|
// Install happens only once a lifetime of a service worker. |
|
|
|
|
|
self.addEventListener('install', function(event) { |
|
|
console.log('[ServiceWorker] Install'); |
|
|
console.log('[ServiceWorker] Install'); |
|
|
|
|
|
// don't wait |
|
|
|
|
|
self.skipWaiting(); |
|
|
|
|
|
// cache static files |
|
|
event.waitUntil( |
|
|
event.waitUntil( |
|
|
caches.open(shellCacheKey).then(function (cache) { |
|
|
|
|
|
console.log('[ServiceWorker] Cache shell files.'); |
|
|
|
|
|
return cache.addAll(shellFilesToCache); |
|
|
|
|
|
}).then(self.skipWaiting()), |
|
|
|
|
|
caches.open(logicCasheKey).then(function (cache) { |
|
|
|
|
|
console.log('[ServiceWorker] Cache logic files.'); |
|
|
|
|
|
return cache.addAll(logicFilesToCache); |
|
|
|
|
|
}).then(self.skipWaiting()), |
|
|
|
|
|
caches.open(dataCacheKey).then(function (cache) { |
|
|
|
|
|
|
|
|
caches.open(staticCacheKey).then(function(cache) { |
|
|
|
|
|
console.log('[ServiceWorker] Cache static files.'); |
|
|
|
|
|
return cache.addAll(staticFilesToCache); |
|
|
|
|
|
}), |
|
|
|
|
|
caches.open(dataCacheKey).then(function(cache) { |
|
|
console.log('[ServiceWorker] Cache data files.'); |
|
|
console.log('[ServiceWorker] Cache data files.'); |
|
|
return cache.addAll(dataFilesToCache); |
|
|
return cache.addAll(dataFilesToCache); |
|
|
}).then(self.skipWaiting()) |
|
|
|
|
|
|
|
|
}) |
|
|
); |
|
|
); |
|
|
}); |
|
|
}); |
|
|
|
|
|
|
|
|
// NOTE: Activate structure and delete older cache versions |
|
|
// NOTE: Activate structure and delete older cache versions |
|
|
self.addEventListener('activate', function (event) { |
|
|
|
|
|
console.log('[ServiceWorker] Activate'); |
|
|
|
|
|
|
|
|
// Activates new version of service worker. |
|
|
|
|
|
// No fetch or pull is called before succesfull activate event. |
|
|
|
|
|
self.addEventListener('activate', function(event) { |
|
|
|
|
|
clients.claim(); |
|
|
|
|
|
var cacheWhitelist = [staticCacheKey, dataCacheKey]; |
|
|
event.waitUntil( |
|
|
event.waitUntil( |
|
|
caches.keys().then(function (cacheKeyList) { |
|
|
|
|
|
|
|
|
caches.keys().then(function(cacheKeyList) { |
|
|
return Promise.all( |
|
|
return Promise.all( |
|
|
cacheKeyList.map(function (key) { |
|
|
|
|
|
if (key !== shellCacheKey && key !== logicCasheKey && key !== dataCacheKey) { |
|
|
|
|
|
|
|
|
cacheKeyList.map(function(key) { |
|
|
|
|
|
if (cacheWhitelist.indexOf(key) === -1) { |
|
|
console.log('[ServiceWorker] Removing old cache', key); |
|
|
console.log('[ServiceWorker] Removing old cache', key); |
|
|
return caches.delete(key); |
|
|
return caches.delete(key); |
|
|
} |
|
|
} |
|
|
}) |
|
|
}) |
|
|
); |
|
|
); |
|
|
|
|
|
}).then(() => { |
|
|
|
|
|
console.log('[ServiceWorker] Activate'); |
|
|
}) |
|
|
}) |
|
|
); |
|
|
); |
|
|
|
|
|
|
|
|
// Shorten activation time for initial [ServiceWorker] call. |
|
|
// Shorten activation time for initial [ServiceWorker] call. |
|
|
//return self.clients.claim(); |
|
|
//return self.clients.claim(); |
|
|
}); |
|
|
}); |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
// NOTE: Fetch structure // TODO: Setup fetching method |
|
|
// NOTE: Fetch structure // TODO: Setup fetching method |
|
|
self.addEventListener('fetch', function (event) { |
|
|
|
|
|
var dataUrl = 'localhost:8888'; // Provide HTTPS URL for query data. |
|
|
|
|
|
|
|
|
self.addEventListener('fetch', function(event) { |
|
|
|
|
|
const dataUrl = ' localhost:8888/'; // Provide HTTPS URL for query data. |
|
|
|
|
|
// const url = new URL(event.request.url); |
|
|
console.log('[ServiceWorker] Fetch', event.request.url); |
|
|
console.log('[ServiceWorker] Fetch', event.request.url); |
|
|
|
|
|
|
|
|
//if (event.request.url.indexOf(dataUrl) > -1) { |
|
|
//if (event.request.url.indexOf(dataUrl) > -1) { |
|
|
|
|
|
|
|
|
*/ |
|
|
*/ |
|
|
|
|
|
|
|
|
/*event.respondWith( |
|
|
/*event.respondWith( |
|
|
caches.open(shellCacheKey).then(function (cache) { |
|
|
|
|
|
return fetch(event.request).then(function (response) { |
|
|
|
|
|
|
|
|
caches.open(staticCacheKey).then(function(cache) { |
|
|
|
|
|
return fetch(event.request).then(function(response) { |
|
|
cache.put(event.request.url, response.clone()); |
|
|
cache.put(event.request.url, response.clone()); |
|
|
return response; |
|
|
return response; |
|
|
}); |
|
|
}); |
|
|
|
|
|
|
|
|
* "Cache, falling back to the network" offline strategy: |
|
|
* "Cache, falling back to the network" offline strategy: |
|
|
* https://jakearchibald.com/2014/offline-cookbook/#cache-falling-back-to-network |
|
|
* https://jakearchibald.com/2014/offline-cookbook/#cache-falling-back-to-network |
|
|
*/ |
|
|
*/ |
|
|
|
|
|
/* |
|
|
|
|
|
// serve the cat SVG from the cache if the request is |
|
|
|
|
|
// same-origin and the path is '/dog.svg' |
|
|
|
|
|
if (url.origin == location.origin && url.pathname == '/dog.svg') { |
|
|
|
|
|
event.respondWith(caches.match('/cat.svg')); |
|
|
|
|
|
} |
|
|
|
|
|
*/ |
|
|
|
|
|
|
|
|
event.respondWith( |
|
|
event.respondWith( |
|
|
caches.match(event.request).then(function (response) { |
|
|
|
|
|
return response || fetch(event.request); |
|
|
|
|
|
|
|
|
caches.match(event.request) |
|
|
|
|
|
.then(function(response) { |
|
|
|
|
|
if (response) { |
|
|
|
|
|
return response; |
|
|
|
|
|
} |
|
|
|
|
|
return fetch(event.request).then( |
|
|
|
|
|
function(response) { |
|
|
|
|
|
// Check if we received a valid response |
|
|
|
|
|
// - Ensure the response is valid. |
|
|
|
|
|
// - Check the status is 200 on the response. |
|
|
|
|
|
// - Make sure the response type is basic, which indicates that it's a request from our origin. |
|
|
|
|
|
// This means that requests to third party assets aren't cached as well. |
|
|
|
|
|
if(!response || response.status !== 200 || response.type !== 'basic') { |
|
|
|
|
|
return response; |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
// IMPORTANT: Clone the response. A response is a stream |
|
|
|
|
|
// and because we want the browser to consume the response |
|
|
|
|
|
// as well as the cache consuming the response, we need |
|
|
|
|
|
// to clone it so we have two streams. |
|
|
|
|
|
// - Reason: response is a stream and object can only consumed once |
|
|
|
|
|
var responseToCache = response.clone(); |
|
|
|
|
|
|
|
|
|
|
|
caches.open(staticCacheKey) |
|
|
|
|
|
.then(function(cache) { |
|
|
|
|
|
cache.put(event.request, responseToCache); |
|
|
|
|
|
}); |
|
|
|
|
|
|
|
|
|
|
|
return response; |
|
|
|
|
|
} |
|
|
|
|
|
); |
|
|
}) |
|
|
}) |
|
|
); |
|
|
); |
|
|
//} |
|
|
//} |