From a3e0c6cef596288220b3f49b9ffca8f1d219058d Mon Sep 17 00:00:00 2001
From: Jason Rasmussen <jason@rasm.me>
Date: Mon, 25 Aug 2025 16:42:30 -0400
Subject: [PATCH] fix: ignore abort errors (#21262)

---
 web/src/service-worker/broadcast-channel.ts | 21 +++++++++-----
 web/src/service-worker/request.ts           | 32 ++++++++++++++-------
 2 files changed, 35 insertions(+), 18 deletions(-)

diff --git a/web/src/service-worker/broadcast-channel.ts b/web/src/service-worker/broadcast-channel.ts
index 3d2845192f..ae6f1e1be6 100644
--- a/web/src/service-worker/broadcast-channel.ts
+++ b/web/src/service-worker/broadcast-channel.ts
@@ -1,4 +1,4 @@
-import { cancelRequest, handleRequest } from './request';
+import { handleCancel, handlePreload } from './request';
 
 export const installBroadcastChannelListener = () => {
   const broadcast = new BroadcastChannel('immich');
@@ -7,12 +7,19 @@ export const installBroadcastChannelListener = () => {
     if (!event.data) {
       return;
     }
-    const urlString = event.data.url;
-    const url = new URL(urlString, event.origin);
-    if (event.data.type === 'cancel') {
-      cancelRequest(url);
-    } else if (event.data.type === 'preload') {
-      handleRequest(url);
+
+    const url = new URL(event.data.url, event.origin);
+
+    switch (event.data.type) {
+      case 'preload': {
+        handlePreload(url);
+        break;
+      }
+
+      case 'cancel': {
+        handleCancel(url);
+        break;
+      }
     }
   };
 };
diff --git a/web/src/service-worker/request.ts b/web/src/service-worker/request.ts
index 10aed23d51..aeb63be899 100644
--- a/web/src/service-worker/request.ts
+++ b/web/src/service-worker/request.ts
@@ -1,5 +1,7 @@
 import { get, put } from './cache';
 
+const pendingRequests = new Map<string, AbortController>();
+
 const isURL = (request: URL | RequestInfo): request is URL => (request as URL).href !== undefined;
 const isRequest = (request: RequestInfo): request is Request => (request as Request).url !== undefined;
 
@@ -21,11 +23,16 @@ const getCacheKey = (request: URL | Request) => {
   throw new Error(`Invalid request: ${request}`);
 };
 
-const pendingRequests = new Map<string, AbortController>();
+export const handlePreload = async (request: URL | Request) => {
+  try {
+    return await handleRequest(request);
+  } catch (error) {
+    console.error(`Preload failed: ${error}`);
+  }
+};
 
 export const handleRequest = async (request: URL | Request) => {
   const cacheKey = getCacheKey(request);
-
   const cachedResponse = await get(cacheKey);
   if (cachedResponse) {
     return cachedResponse;
@@ -41,23 +48,26 @@ export const handleRequest = async (request: URL | Request) => {
 
     return response;
   } catch (error) {
-    console.log(error);
-    return new Response(undefined, {
-      status: 499,
-      statusText: `Request canceled: Instructions unclear, accidentally interrupted myself (${error})`,
-    });
+    if (error.name === 'AbortError') {
+      // dummy response avoids network errors in the console for these requests
+      return new Response(undefined, { status: 204 });
+    }
+
+    console.log('Not an abort error', error);
+
+    throw error;
   } finally {
     pendingRequests.delete(cacheKey);
   }
 };
 
-export const cancelRequest = (url: URL) => {
+export const handleCancel = (url: URL) => {
   const cacheKey = getCacheKey(url);
-  const pending = pendingRequests.get(cacheKey);
-  if (!pending) {
+  const pendingRequest = pendingRequests.get(cacheKey);
+  if (!pendingRequest) {
     return;
   }
 
-  pending.abort();
+  pendingRequest.abort();
   pendingRequests.delete(cacheKey);
 };