Files
goldenChart/frontend_golden/public/firebase-messaging-sw.js
T
2026-05-23 15:11:48 +09:00

64 lines
2.4 KiB
JavaScript

/**
* Firebase Cloud Messaging Service Worker
* - 브라우저 종료 시에도 푸시 알림 수신
* - REACT_APP_FIREBASE_* 환경 변수로 설정 (빌드 시 주입)
*
* 설정 방법:
* 1. Firebase Console에서 프로젝트 생성
* 2. Cloud Messaging 활성화, VAPID 키 발급
* 3. .env에 REACT_APP_FIREBASE_VAPID_KEY 등 설정
* 4. 이 파일이 public/에 있으면 빌드 시 복사됨
*/
importScripts('https://www.gstatic.com/firebasejs/10.7.1/firebase-app-compat.js');
importScripts('https://www.gstatic.com/firebasejs/10.7.1/firebase-messaging-compat.js');
// Firebase 설정 - 빌드 시 환경 변수로 치환되거나, 수동 설정
const firebaseConfig = {
apiKey: 'YOUR_API_KEY',
authDomain: 'YOUR_PROJECT.firebaseapp.com',
projectId: 'YOUR_PROJECT_ID',
storageBucket: 'YOUR_PROJECT.appspot.com',
messagingSenderId: 'YOUR_SENDER_ID',
appId: 'YOUR_APP_ID',
};
if (firebaseConfig.apiKey && firebaseConfig.apiKey !== 'YOUR_API_KEY') {
firebase.initializeApp(firebaseConfig);
const messaging = firebase.messaging();
messaging.onBackgroundMessage((payload) => {
console.log('[firebase-messaging-sw] Received background message:', payload);
const notificationTitle = payload.notification?.title || '골든 애널리시스';
const notificationOptions = {
body: payload.notification?.body || payload.data?.message || '새 알림이 도착했습니다.',
icon: '/favicon.ico',
badge: '/favicon.ico',
tag: 'golden-analysis-fcm',
data: payload.data || {},
requireInteraction: false,
};
return self.registration.showNotification(notificationTitle, notificationOptions);
});
self.addEventListener('notificationclick', (event) => {
event.notification.close();
const data = event.notification.data || {};
const url = data.page || '/#/alerts';
event.waitUntil(
clients.matchAll({ type: 'window', includeUncontrolled: true }).then((clientList) => {
for (const client of clientList) {
if (client.url.includes(self.location.origin) && 'focus' in client) {
client.navigate(url);
return client.focus();
}
}
if (clients.openWindow) {
return clients.openWindow(self.location.origin + (url.startsWith('/') ? url : '/' + url));
}
})
);
});
}