forked from CharlyLabIUTNC/DEMOES
-
Notifications
You must be signed in to change notification settings - Fork 0
/
serviceWorker.js
82 lines (74 loc) · 3.27 KB
/
serviceWorker.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
/**
* Une variable pour enregistrer le nom du cache est créée, les fichiers de l'app shell sont listés dans un tableau.
*/
const staticCacheName = "cache-v2";
const assets = [
"./",
"index.html",
]
/**
* Une fois que l'enregistrement a été réalisé, le fichier sw.js est automatiquement téléchargé, puis installé, et finalement activé.
* L'API nous permet d'ajouter des intercepteurs d'événements ou event listeners pour les événements clef qui nous intéressent — le premier est l'événement install
* Dans le listener install, nous pouvons initialiser le cache et y ajouter des fichiers pour une utilisation hors connexion. Notre app cache-v2 ci-dessus fait exactement ça
*/
self.addEventListener('install', (e)=>{
e.waitUntil(
caches.open(staticCacheName).then((cache)=>{
cache.addAll(assets);
})
)
});
/**
* Il permet d'intercepter des requêtes et d'y répondre de façon personnalisée. Voic un exemple d'utilisation simpliste
* La réponse peut être ce que nous voulons: le fichier demandé, sa copie mise en cache ou un bout de code JavaScript qui fera quelque chose de particulier — les possibilités sont infinies
*/
self.addEventListener('fetch', (event)=>{
event.respondWith(
caches.match(event.request)
.then(function(response) {
// Cache hit - return response
if (response) {
return response;
}
// IMPORTANT: Cloner la requête.
// Une requete est un flux et est à consommation unique
// Il est donc nécessaire de copier la requete pour pouvoir l'utiliser et la servir
let fetchRequest = event.request.clone();
return fetch(fetchRequest).then(
function(response) {
if (!response || response.status !== 200 || response.type !== 'basic') {
return response;
}
// IMPORTANT: Même constat qu'au dessus, mais pour la mettre en cache
let responseToCache = response.clone();
// ignore des demandes de chrome-extension
if((event.request.url.indexOf('http') === 0)) {
caches.open(staticCacheName)
.then(function (cache) {
cache.put(event.request, responseToCache).then(res => console.log(res));
});
return response;
}
}
);
})
);
});
/**
* Il permet de vider l'ancien cache dont nous n'avons désormais plus besoin
*/
self.addEventListener('activate', function(event) {
event.waitUntil(
caches.keys().then(function(cacheNames) {
return Promise.all(
cacheNames.filter(function(cacheName) {
// Return true if you want to remove this cache,
// but remember that caches are shared across
// the whole origin
}).map(function(cacheName) {
return caches.delete(cacheName);
})
);
})
);
});