From 049ffb6f07a56c921bb91decf81f7a41c1ceb40d Mon Sep 17 00:00:00 2001 From: Gigin George Date: Mon, 3 Apr 2023 10:58:58 +0530 Subject: [PATCH] Update service-worker to use NetworkFirst --- src/service-worker.ts | 63 +++++++++++++++++++++++++++---------------- 1 file changed, 40 insertions(+), 23 deletions(-) diff --git a/src/service-worker.ts b/src/service-worker.ts index c181c1509c0..292c85b8f74 100644 --- a/src/service-worker.ts +++ b/src/service-worker.ts @@ -10,47 +10,64 @@ import { clientsClaim } from "workbox-core"; import { ExpirationPlugin } from "workbox-expiration"; -import { precacheAndRoute, createHandlerBoundToURL } from "workbox-precaching"; +import { precacheAndRoute } from "workbox-precaching"; +// import { createHandlerBoundToURL } from "workbox-precaching"; import { registerRoute } from "workbox-routing"; import { StaleWhileRevalidate } from "workbox-strategies"; +import { NetworkFirst } from "workbox-strategies"; declare const self: ServiceWorkerGlobalScope; clientsClaim(); +const toPrecache = self.__WB_MANIFEST.filter((file) => { + // Check if file is a string + if (typeof file === "string") { + return !file.includes("index.html"); + } else { + return !file.url.includes("index.html"); + } +}); + // Precache all of the assets generated by your build process. // Their URLs are injected into the manifest variable below. // This variable must be present somewhere in your service worker file, // even if you decide not to use precaching. See https://cra.link/PWA -precacheAndRoute(self.__WB_MANIFEST); +// precacheAndRoute(self.__WB_MANIFEST); +precacheAndRoute(toPrecache); // Set up App Shell-style routing, so that all navigation requests // are fulfilled with your index.html shell. Learn more at // https://developers.google.com/web/fundamentals/architecture/app-shell -const fileExtensionRegexp = new RegExp("/[^/?]+\\.[^/]+$"); -registerRoute( - // Return false to exempt requests from being fulfilled by index.html. - ({ request, url }: { request: Request; url: URL }) => { - // If this isn't a navigation, skip. - if (request.mode !== "navigate") { - return false; - } +// const fileExtensionRegexp = new RegExp("/[^/?]+\\.[^/]+$"); +// registerRoute( +// // Return false to exempt requests from being fulfilled by index.html. +// ({ request, url }: { request: Request; url: URL }) => { +// // If this isn't a navigation, skip. +// if (request.mode !== "navigate") { +// return false; +// } - // If this is a URL that starts with /_, skip. - if (url.pathname.startsWith("/_")) { - return false; - } +// // If this is a URL that starts with /_, skip. +// if (url.pathname.startsWith("/_")) { +// return false; +// } - // If this looks like a URL for a resource, because it contains - // a file extension, skip. - if (url.pathname.match(fileExtensionRegexp)) { - return false; - } +// // If this looks like a URL for a resource, because it contains +// // a file extension, skip. +// if (url.pathname.match(fileExtensionRegexp)) { +// return false; +// } - // Return true to signal that we want to use the handler. - return true; - }, - createHandlerBoundToURL(process.env.PUBLIC_URL + "/index.html") +// // Return true to signal that we want to use the handler. +// return true; +// }, +// createHandlerBoundToURL(process.env.PUBLIC_URL + "/index.html") +// ); + +registerRoute( + ({ url }) => url.pathname.includes("index.html"), + new NetworkFirst() ); // An example runtime caching route for requests that aren't handled by the