network first for html

service-worker.js

@@ -1,27 +1,20 @@
 import { precacheAndRoute } from "workbox-precaching/precacheAndRoute";
+import { CacheableResponsePlugin } from "workbox-cacheable-response";
+import { NetworkFirst } from "workbox-strategies";
+import { registerRoute } from "workbox-routing";
 
 precacheAndRoute(self.__WB_MANIFEST);
 
-self.addEventListener("fetch", (event) => {
-    const { request } = event;
-    const url = request.url;
+registerRoute(
+    ({ request }) =>
+        request.mode === "navigate" || request.headers.get("accept")?.includes("text/html"),
 
-    console.log(
-        request.url,
-        request.mode,
-        request.redirect,
-        `includes oauth: ${url.includes("oauth")}`
-    );
-
-    if (url.includes("oauth")) {
-        const newRequest = new Request(url, {
-            method: "GET",
-            headers: request.headers,
-            mode: "no-cors",
-            credentials: request.credentials,
-            redirect: request.redirect,
-        });
-
-        event.respondWith(fetch(newRequest));
-    }
-});
+    new NetworkFirst({
+        cacheName: "html-cache",
+        plugins: [
+            new CacheableResponsePlugin({
+                statuses: [0, 200],
+            }),
+        ],
+    })
+);