From 1b7fa0bacfe736bb7d78f3fbba72a2c2023cd65c Mon Sep 17 00:00:00 2001
From: dm1sh <me@dmitriy.icu>
Date: Sat, 31 Jul 2021 21:55:05 +0300
Subject: [PATCH] Added fetch handler in service worker

---
 src/serviceWorker/cache.ts         |  7 ++++---
 src/serviceWorker/fetchHandlers.ts | 16 ++++++++++++++++
 src/serviceWorker/index.ts         | 14 +++++++++++++-
 3 files changed, 33 insertions(+), 4 deletions(-)
 create mode 100644 src/serviceWorker/fetchHandlers.ts

diff --git a/src/serviceWorker/cache.ts b/src/serviceWorker/cache.ts
index 600a076..6ef2ece 100644
--- a/src/serviceWorker/cache.ts
+++ b/src/serviceWorker/cache.ts
@@ -11,12 +11,13 @@ export const precache = async () =>
 /**
  * Requests file from network or gets it from cache if offline
  */
-export const fromCache = async (request: Request) => {
+export const fromCache = async (request: Request): Promise<Response> => {
   try {
     const response = await fetch(request);
-    (await getCache()).put(request, response);
+    (await getCache()).put(request, response.clone());
     return response;
   } catch (err) {
-    return (await getCache()).match(request);
+    const response = await (await getCache()).match(request);
+    return response || new Response();
   }
 };
diff --git a/src/serviceWorker/fetchHandlers.ts b/src/serviceWorker/fetchHandlers.ts
new file mode 100644
index 0000000..7668de9
--- /dev/null
+++ b/src/serviceWorker/fetchHandlers.ts
@@ -0,0 +1,16 @@
+export interface PathHandler {
+  /** Path start for handler */
+  path: string;
+  /** Function returning Response object */
+  getResponse: () => Response | Promise<Response>;
+}
+
+/**
+ * Routes fetch request path to specified handler
+ */
+export const handle = (requestPath: string, table: PathHandler[]) => {
+  for (const { path, getResponse: response } of table)
+    if (requestPath.startsWith(path)) return response();
+
+  return new Response();
+};
diff --git a/src/serviceWorker/index.ts b/src/serviceWorker/index.ts
index fcd6ebd..927a0a1 100644
--- a/src/serviceWorker/index.ts
+++ b/src/serviceWorker/index.ts
@@ -1,5 +1,6 @@
-import { precache } from "./cache";
+import { fromCache, precache } from "./cache";
 import { openDB as createDB } from "./db";
+import { handle, PathHandler } from "./fetchHandlers";
 
 declare const self: ServiceWorkerGlobalScope;
 
@@ -9,3 +10,14 @@ self.addEventListener("install", (event) => {
 });
 
 self.addEventListener("activate", (event) => event.waitUntil(createDB()));
+
+self.addEventListener("fetch", (event) => {
+  const { request } = event;
+  const path = new URL(request.url).pathname;
+
+  const handlers: PathHandler[] = [
+    { path: "", getResponse: () => fromCache(request) },
+  ];
+
+  event.respondWith(handle(path, handlers));
+});