-
Notifications
You must be signed in to change notification settings - Fork 7
/
service-worker.js
95 lines (84 loc) · 3.02 KB
/
service-worker.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
'use strict';
var CACHE_NAME = 'number-rush-cache-v13';
// The files we want to cache
const urlsToCache = [
'index.html',
'assets/audio/beep.mp3',
'assets/audio/incorrect.mp3',
'assets/audio/success.mp3',
'assets/images/favicon.ico',
'assets/images/arrow.svg',
'assets/styles/css/main.min.css',
'assets/scripts/dist/bundle.js'
];
// Install service worker with cache name and add urls above
self.addEventListener('install', function(event) {
// Perform install steps
event.waitUntil(
caches.open(CACHE_NAME)
.then(function(cache) {
console.log('WORKER: Opened cache');
return cache.addAll(urlsToCache);
})
.then(function() {
console.log('WORKER: Install completed');
})
.catch(function(err) {
console.error('Error: ' + err);
})
);
});
// Listen for when the browser attempts to fetch assets
self.addEventListener('fetch', function(event) {
event.respondWith(
caches.match(event.request)
.then(function(response) {
// Cache hit - return response
if (response) {
return response;
}
// IMPORTANT: Clone the request. A request is a stream and
// can only be consumed once. Since we are consuming this
// once by cache and once by the browser for fetch, we need
// to clone the response
var fetchRequest = event.request.clone();
return fetch(fetchRequest).then(
function(response) {
// Check if we received a valid response
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 2 stream.
var responseToCache = response.clone();
caches.open(CACHE_NAME)
.then(function(cache) {
cache.put(event.request, responseToCache);
});
return response;
}
);
})
.catch(function(err) {
console.error('Error: ' + err)
})
);
});
// Delete pre-existing caches that aren't in a whitelist
self.addEventListener('activate', function(event) {
// Store any cache names in this array to avoid deletion.
var cacheWhitelist = [CACHE_NAME];
event.waitUntil(
caches.keys().then(function(cacheNames) {
return Promise.all(
cacheNames.map(function(cacheName) {
if (cacheWhitelist.indexOf(cacheName) === -1) {
return caches.delete(cacheName);
}
})
);
})
);
});