SecureNotes/public/serviceworker.js

function log(...params) {
    console.log.apply(this, [...["%c[SW]: %c", "color: #f4b942;", "color:unset;"], ...params])
}

const CACHE = "offline";

let precacheFiles = [
    "/",
    "/main.js",
    "/main.css",
    "/serviceworker.js"
]

//Install stage sets up the cache-array to configure pre-cache content
self.addEventListener('install', (evt) => {
    log('The service worker is being installed.');
    evt.waitUntil(precache().then(() => {
        log('Skip waiting on install');
    }).catch(log).then(() => self.skipWaiting()));
});

//allow sw to control of current page
self.addEventListener('activate', (event) => {
    log('Claiming clients for current page');
    return self.clients.claim();
});

self.addEventListener('message', (event) => {
    if (event.data === "clear_cache") {
        log("Clearing cache");
        caches.delete(CACHE);
    }

    if (event.data === "update_index") {
        log("Updating index");
        event.waitUntil(caches.open(CACHE).then((cache) => {
            return cache.addAll(["/", "/index.html"]).then(() => {
                event.ports[0].postMessage("reload");
            });
        }))
    }
});

var Types;
(function (Types) {
    Types[Types["CACHE"] = 0] = "CACHE";
    Types[Types["NOCACHE"] = 1] = "NOCACHE";
    Types[Types["REFRESH"] = 2] = "REFRESH";
})(Types || (Types = {}));

let rules = [
    {
        match: (url) => {
            return url.indexOf("/api/") >= 0;
        },
        type: Types.NOCACHE
    },
    {
        match: (url) => {
            return url.indexOf("/version_hash") >= 0;
        },
        type: Types.NOCACHE
    },
    {
        match: () => {
            return true;
        },
        type: Types.REFRESH
    }
]

self.addEventListener('fetch', (evt) => {
    if (evt.request.method != 'GET') return; // Dont care about POST requests
    let rule = rules.find(rule => rule.match(evt.request.url));
    evt.respondWith((async () => {
        log("Cache:", Types[rule.type]);
        switch (rule.type) {
            case Types.CACHE:
                return fromCache(evt.request);
            case Types.REFRESH:
                return refresh(evt.request).then(r => {
                    evt.waitUntil(r.refresh.catch(_ => { }));
                    return r.result;
                });
            case Types.NOCACHE:
                return fetch(evt.request);
        }
    })());
});

async function fromCache(request) {
    let cache = await caches.open(CACHE);
    let matching = await cache.match(request);
    if (matching)
        return matching

    let res = await fetch(request.clone());
    await cache.put(request, res);
    return await cache.match(request);
}

async function refresh(request) {
    let cache = await caches.open(CACHE);
    let web = fetch(request.clone()).then(res => {
        return cache.put(request, res).then(() => {
            return cache.match(request);
        })
    })
    let matching = await cache.match(request);

    return {
        result: matching ? matching : web,
        refresh: web
    }
}

function precache() {
    return caches.open(CACHE).then(function (cache) {
        return cache.addAll(precacheFiles);
    });
}