feat(develop): 포그라운드 백링크

Docent-Inc · Jan 13, 2024 · 5d8e0ef · 5d8e0ef
1 parent 3014bfb
commit 5d8e0ef
Show file tree

Hide file tree

Showing 3 changed files with 50 additions and 21 deletions.
diff --git a/public/firebase-messaging-sw.js b/public/firebase-messaging-sw.js
@@ -21,24 +21,6 @@ const messaging = firebase.messaging(app);
 /**
  * messaging.onBackgroundMessage - 앱 사용하지 않는 중 메시지 수신 (백그라운드)
  */
-self.addEventListener("activate", (event) => {
-    event.waitUntil(
-        clients
-            .matchAll({ type: "window", includeUncontrolled: true })
-            .then((clientList) => {
-                return Promise.all(
-                    clientList.map((client) => {
-                        return client.postMessage({
-                            type: "SERVICE_WORKER_ACTIVATED",
-                        });
-                    }),
-                );
-            })
-            .then(() => {
-                return self.clients.claim(); // 제어권을 즉시 넘깁니다.
-            }),
-    );
-});
 
 self.addEventListener("notificationclick", (event) => {
     event.notification.close(); // 알림 닫기
@@ -77,7 +59,6 @@ self.addEventListener("notificationclick", (event) => {
                         }
                     });
                 } else if (clients.openWindow) {
-                    // console.log(clients);
                     return clients.openWindow(urlToOpen.href);
                 }
             }),

diff --git a/public/service-worker.js b/public/service-worker.js
@@ -6,7 +6,6 @@ importScripts(
 );
 
 self.addEventListener("message", (event) => {
-    // console.log(event);
     if (event.data && event.data.type === "SKIP_WAITING") {
         self.skipWaiting();
     }

diff --git a/registerServiceWorker.js b/registerServiceWorker.js
@@ -3,11 +3,60 @@ import { register } from "register-service-worker";
 export function SW() {
     // if (process.env.NODE_ENV === "production") {
     navigator.serviceWorker.addEventListener("message", (event) => {
-        if (event.data && event.data.includes("docent")) {
+        if (typeof event.data === "string" && event.data.includes("docent")) {
             window.location.href = event.data;
+        } else if (event.data.data.landing_url) {
+            window.location.href = `https://docent.zip${event.data.data.landing_url}`;
         }
     });
 
+    navigator.serviceWorker.addEventListener("notificationclick", (event) => {
+        event.notification.close(); // 알림 닫기
+
+        const landing_url = event.notification.data;
+        const newPath = landing_url ? landing_url : `/chat`;
+
+        const urlToOpen = new URL(`https://docent.zip${newPath}`);
+
+        event.waitUntil(
+            clients
+                .matchAll({
+                    type: "window",
+                    includeUncontrolled: true, // 포커스된 창이 없을 때 새 창 열기
+                })
+                .then((windowClients) => {
+                    let foundWindowClient = null;
+                    // 이미 열려 있는 창에서 동일한 URL을 찾기 위한 로직 추가
+                    for (let i = 0; i < windowClients.length; i++) {
+                        const client = windowClients[i];
+
+                        if (
+                            new URL(client.url).hostname.includes(
+                                "localhost",
+                            ) &&
+                            "focus" in client
+                        ) {
+                            foundWindowClient = client;
+                            // console.log(event.currentTarget.clients);
+                            break;
+                        }
+                    }
+
+                    if (foundWindowClient) {
+                        return foundWindowClient
+                            .focus()
+                            .then((focusedClient) => {
+                                if ("navigate" in focusedClient) {
+                                    focusedClient.postMessage(urlToOpen.href);
+                                }
+                            });
+                    } else if (clients.openWindow) {
+                        return clients.openWindow(urlToOpen.href);
+                    }
+                }),
+        );
+    });
+
     register(`/service-worker.js`, {
         ready() {
             // console.log(