vlw/victorwesterlund.com
1
0
Fork 0
mirror of https://codeberg.org/vlw/victorwesterlund.com.git synced 2025-09-14 11:33:41 +02:00
Code Issues Projects Releases Packages Wiki Activity Actions

Merge pull request #6 from VictorWesterlund/feature/sw

Browse source 
Service Worker & Offline Caching
This commit is contained in:
Victor Westerlund 2020-12-14 08:06:49 +01:00 • committed by GitHub
commit a9d7083e23
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
4 changed files with 90 additions and 10 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

8
public/assets/img/pattern.php Normal file
View file

@ -0,0 +1,8 @@
<?php
$gif = imagecreatefromgif("./pattern.gif");
header("Content-Type: image/gif");
imagegif($gif);
imagedestroy($gif);

3
public/assets/js/script.js
View file

@ -0,0 +1,3 @@
if(navigator.serviceWorker) {
navigator.serviceWorker.register("sw.js");
}

10
public/index.html
View file

@ -1,13 +1,6 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"> <html lang="en">
<head> <head>
<!-- Google Tag Manager -->
<script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
})(window,document,'script','dataLayer','GTM-5PBVM28');</script>
<!-- End Google Tag Manager -->
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="Full-stack web developer from Stockholm, Sweden."> <meta name="description" content="Full-stack web developer from Stockholm, Sweden.">
@ -17,9 +10,6 @@
<title>Victor Westerlund</title> <title>Victor Westerlund</title>
</head> </head>
<body> <body>
<!-- Google Tag Manager (noscript) -->
<noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-5PBVM28" height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
<!-- End Google Tag Manager (noscript) -->
<main> <main>
<div id="intro"> <div id="intro">
<div class="inner"> <div class="inner">

79
public/sw.js
View file

@ -0,0 +1,79 @@
const version = "12062129";
const root = "/victorwesterlund.com/public/";
let activeCaches = [
`content-${version}`
];
self.addEventListener("install", event => {
event.waitUntil(
caches.open(`content-${version}`).then(cache => cache.addAll([
root,
root + "offline.txt",
root + "assets/css/style.css",
root + "assets/img/favicon.png",
root + "assets/js/script.js",
root + "assets/img/pattern.gif",
root + "assets/fonts/RobotoMono-Bold.woff2",
root + "assets/fonts/RobotoMono-Regular.woff2"
]))
)
});
self.addEventListener("activate", event => {
event.waitUntil(
// Delete inactive caches
caches.keys().then(cacheNames => {
return Promise.all(
cacheNames.map(cacheName => {
if(!activeCaches.includes(cacheName)) {
return caches.delete(cacheName);
}
})
)
})
)
});
// Fetch and save content to bucket
async function fetchContent(event) {
const networkFetch = fetch(event.request);
event.waitUntil(
networkFetch.then(response => {
const responseClone = response.clone();
caches.open("bucket").then(cache => cache.put(event.request, responseClone));
})
);
const response = await caches.match(event.request);
return response || networkFetch;
}
self.addEventListener("fetch", event => {
const url = new URL(event.request.url);
const origin = (url.origin == location.origin) ? true : false; // Is same-origin
// Fetch cross-origin content
if(!origin) {
event.respondWith(fetch(url.href));
return;
}
// Get pattern.gif from generator. Fallback to cache on failure
if(origin && url.pathname.endsWith("pattern.gif")) {
const pattern = new Request(`${location.origin}/${root}assets/img/pattern.php`);
event.respondWith(
fetch(pattern).catch(() => {
return caches.match(event.request);
})
);
return;
}
// Respond with content for cache or fetch and save
event.respondWith(
caches.match(event.request).then(response => response || fetchContent(event))
);
});
// Victor Westerlund