Last active 1739772657

Revision 9fd14b8654cda72f5b5ce94896b211fcf6785ccb

README.md Raw

Service Worker - Offline Page

gistfile1.txt Raw
1<!DOCTYPE html><html lang="en"> <head><meta charset="UTF-8"><meta name="description" content="Astro description"><meta name="viewport" content="width=device-width"><link rel="icon" type="image/svg+xml" href="/favicon.svg"><meta name="generator" content="Astro v4.0.5"><title>Welcome to Astro.</title><style>:root{--accent: 136, 58, 234;--accent-light: 224, 204, 250;--accent-dark: 49, 10, 101;--accent-gradient: linear-gradient( 45deg, rgb(var(--accent)), rgb(var(--accent-light)) 30%, white 60% )}html{font-family:system-ui,sans-serif;background:#13151a;background-size:224px}code{font-family:Menlo,Monaco,Lucida Console,Liberation Mono,DejaVu Sans Mono,Bitstream Vera Sans Mono,Courier New,monospace}
2 main[data-astro-cid-orgni7iu]{margin:auto;padding:1rem;width:800px;max-width:calc(100% - 2rem);color:#fff;font-size:20px;line-height:1.6}svg[data-astro-cid-orgni7iu]{fill:#fff}.astro-a[data-astro-cid-orgni7iu]{position:absolute;top:-32px;left:50%;transform:translate(-50%);width:220px;height:auto;z-index:-1}h1[data-astro-cid-orgni7iu]{font-size:4rem;font-weight:700;line-height:1;text-align:center;margin-bottom:1em}.text-gradient[data-astro-cid-orgni7iu]{background-image:var(--accent-gradient);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-size:400%;background-position:0%}.error[data-astro-cid-orgni7iu]{margin-bottom:2rem;border:1px solid rgba(var(--accent-light),25%);background:linear-gradient(#650a0aa8,#650a0a54);padding:1.5rem;border-radius:8px;align-items:center;display:flex;gap:12px}.error[data-astro-cid-orgni7iu] code[data-astro-cid-orgni7iu]{font-size:.8em;font-weight:700;background:rgba(var(--accent-light),12%);color:rgb(var(--accent-light));border-radius:4px;padding:.3em .4em}.error[data-astro-cid-orgni7iu] strong[data-astro-cid-orgni7iu]{color:rgb(var(--accent-light))}.instructions[data-astro-cid-orgni7iu]{margin-bottom:2rem;border:1px solid rgba(var(--accent-light),25%);background:linear-gradient(rgba(var(--accent-dark),66%),rgba(var(--accent-dark),33%));padding:1.5rem;border-radius:8px}.instructions[data-astro-cid-orgni7iu] code[data-astro-cid-orgni7iu]{font-size:.8em;font-weight:700;background:rgba(var(--accent-light),12%);color:rgb(var(--accent-light));border-radius:4px;padding:.3em .4em}.instructions[data-astro-cid-orgni7iu] strong[data-astro-cid-orgni7iu]{color:rgb(var(--accent-light))}.link-card-grid[data-astro-cid-orgni7iu]{display:grid;grid-template-columns:repeat(auto-fit,minmax(24ch,1fr));gap:2rem;padding:0}
3 </style><script type="module">"serviceWorker"in navigator&&navigator.serviceWorker.register("service-worker.js");
4 </script></head> <body> <main data-astro-cid-orgni7iu> <p class="error" data-astro-cid-orgni7iu><svg xmlns="http://www.w3.org/2000/svg" height="16" width="16" viewBox="0 0 512 512" data-astro-cid-orgni7iu><!--!Font Awesome Free 6.5.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2023 Fonticons, Inc.--><path d="M256 512A256 256 0 1 0 256 0a256 256 0 1 0 0 512zm0-384c13.3 0 24 10.7 24 24V264c0 13.3-10.7 24-24 24s-24-10.7-24-24V152c0-13.3 10.7-24 24-24zM224 352a32 32 0 1 1 64 0 32 32 0 1 1 -64 0z" data-astro-cid-orgni7iu></path></svg> You're offline, check your internet connection and try again.</p> </main> </body></html>
service-worker.js Raw
1'use strict';
2
3var cacheVersion = 1;
4var currentCache = {
5 offline: 'offline-cache' + cacheVersion
6};
7const offlineUrl = 'offline.html';
8
9this.addEventListener('install', event => {
10 event.waitUntil(
11 caches.open(currentCache.offline).then(function (cache) {
12 return cache.addAll([
13 offlineUrl
14 ]);
15 })
16 );
17});
18
19this.addEventListener('fetch', event => {
20 // request.mode = navigate isn't supported in all browsers
21 // so include a check for Accept: text/html header.
22 if (event.request.mode === 'navigate' || (event.request.method === 'GET' && event.request.headers.get('accept').includes('text/html'))) {
23 event.respondWith(
24 fetch(event.request.url).catch(error => {
25 // Return the offline page
26 return caches.match(offlineUrl);
27 })
28 );
29 }
30 else {
31 // Respond with everything else if we can
32 event.respondWith(caches.match(event.request)
33 .then(function (response) {
34 return response || fetch(event.request);
35 })
36 );
37 }
38});