amirreza/service-worker-starter
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Strategy: cache with network fallback

Browse Source
This commit is contained in:
AmirrezaRezaeii
2026-04-21 15:16:30 +03:30
parent fbfb78b109
commit 5a5bd5ff1a
1 changed files with 38 additions and 20 deletions
Download Patch File Download Diff File Expand all files Collapse all files

58
public/sw.js
View File

@@ -7,7 +7,13 @@ self.addEventListener("install", function (event) {
event.waitUntil(
caches.open(CACHE_STATIC_NAME).then((cache) => {
console.log("[SW precache]");
return cache.addAll(["/", "/index.html", "/offline.html", "/help/index.html", "/js/app.js"]);
return cache.addAll([
"/",
"/index.html",
"/offline.html",
"/help/index.html",
"/js/app.js",
]);
}),
);
});
@@ -29,26 +35,38 @@ self.addEventListener("activate", function (event) {
return self.clients.claim();
});
self.addEventListener("fetch", function (event) {
// self.addEventListener("fetch", function (event) {
// event.respondWith(
// caches.match(event.request).then((res) => {
// console.log("res", res);
// if (res) {
// return res;
// } else {
// return fetch(event.request.url)
// .then((res) => {
// return caches.open(CACHE_DYNAMIC_NAME).then((cache) => {
// cache.put(event.request.url, res.clone());
// return res;
// });
// })
// .catch(() => {
// return caches.open(CACHE_STATIC_NAME).then((cache) => {
// return cache.match("/offline.html");
// });
// });
// }
// }),
// );
// });
// Strategy: cache with network fallback
self.addEventListener("fetch", (event) => {
event.respondWith(
caches.match(event.request).then((res) => {
console.log("res", res);
if (res) {
return res;
} else {
return fetch(event.request.url)
.then((res) => {
return caches.open(CACHE_DYNAMIC_NAME).then((cache) => {
cache.put(event.request.url, res.clone());
return res;
});
})
.catch(() => {
return caches.open(CACHE_STATIC_NAME).then((cache) => {
return cache.match("/offline.html");
});
});
}
caches.open(CACHE_STATIC_NAME).then((cache) => {
return cache.match(event.request).then((res) => {
return res || fetch(event.request);
});
}),
);
});