From 1b194745c0c45f63b0d4a1657d9a4e1d3a9a24ed Mon Sep 17 00:00:00 2001 From: Nolan Lawson Date: Thu, 15 Mar 2018 00:03:22 -0700 Subject: [PATCH] rewrite service worker to use async/await --- templates/service-worker.js | 101 ++++++++++++++++-------------------- 1 file changed, 44 insertions(+), 57 deletions(-) diff --git a/templates/service-worker.js b/templates/service-worker.js index 9867170..09de8cf 100644 --- a/templates/service-worker.js +++ b/templates/service-worker.js @@ -11,29 +11,24 @@ const cached = new Set(toCache) const routes = __routes__ self.addEventListener('install', event => { - event.waitUntil( - caches - .open(ASSETS) - .then(cache => cache.addAll(toCache)) - .then(() => { - self.skipWaiting() - }) - ) + event.waitUntil((async function () { + let cache = await caches.open(ASSETS) + await cache.addAll(toCache) + self.skipWaiting() + })()) }) self.addEventListener('activate', event => { - event.waitUntil( - caches.keys().then(async keys => { - // delete old caches - for (const key of keys) { - if (key !== ASSETS) { - await caches.delete(key) - } + event.waitUntil((async function () { + let keys = await caches.keys() + // delete old caches + for (let key of keys) { + if (key !== ASSETS) { + await caches.delete(key) } - - await self.clients.claim() - }) - ) + } + await self.clients.claim() + })()) }) const CACHE_FIRST = [ @@ -49,47 +44,39 @@ self.addEventListener('fetch', event => { return } - // always serve assets and webpack-generated files from cache - if (cached.has(url.pathname)) { - event.respondWith(caches.match(req)) - return - } + event.respondWith((async function () { + // always serve assets and webpack-generated files from cache + if (cached.has(url.pathname)) { + return caches.match(req) + } - // for pages, you might want to serve a shell `index.html` file, - // which Sapper has generated for you. It's not right for every - // app, but if it's right for yours then uncomment this section + // for pages, you might want to serve a shell `index.html` file, + // which Sapper has generated for you. It's not right for every + // app, but if it's right for yours then uncomment this section - if (url.origin === self.origin && routes.find(route => route.pattern.test(url.pathname))) { - event.respondWith(caches.match('/index.html')) - return - } + if (url.origin === self.origin && + routes.find(route => route.pattern.test(url.pathname))) { + return caches.match('/index.html') + } - // For non-GET requests, go network-only - if (req.method !== 'GET') { - event.respondWith(fetch(req)) - return - } - - // For these, go cache-first. - if (CACHE_FIRST.some(pattern => url.pathname.startsWith(pattern))) { - event.respondWith(caches - .open(`offline${timestamp}`) - .then(async cache => { - let response = await cache.match(req) - if (response) { - // update asynchronously - fetch(req).then(response => { - cache.put(req, response.clone()) - }) - return response - } - response = await fetch(req) - cache.put(req, response.clone()) + // For these GET requests, go cache-first + if (req.method === 'GET' && + CACHE_FIRST.some(pattern => url.pathname.startsWith(pattern))) { + let cache = await caches.open(`offline${timestamp}`) + let response = await cache.match(req) + if (response) { + // update asynchronously + fetch(req).then(response => { + cache.put(req, response.clone()) + }) return response - })) - return - } + } + response = await fetch(req) + cache.put(req, response.clone()) + return response + } - // for everything else, go network-only - event.respondWith(fetch(req)) + // for everything else, go network-only + return fetch(req) + })()) })