diff --git a/public/firebase-messaging-sw.js b/public/firebase-messaging-sw.js new file mode 100644 index 00000000..a5781fae --- /dev/null +++ b/public/firebase-messaging-sw.js @@ -0,0 +1,31 @@ +import { precacheAndRoute } from 'workbox-precaching'; + +precacheAndRoute(self.__WB_MANIFEST); + +self.addEventListener('install', function (e) { + console.log('[FCM] Service Worker Installed.'); + self.skipWaiting(); +}); + +self.addEventListener('activate', function (e) { + console.log('[FCM] Service Worker Activated.'); +}); + +self.addEventListener('push', function (e) { + const data = e.data.json(); + + if (!data) { + return; + } + + console.log('[FCM] Push Received.'); + + const title = data.notification.title; + + const options = { + icon: data.notification.image, + ...data.notification + }; + + self.registration.showNotification(title, options); +}); diff --git a/public/apple-touch-icon-180x180.png b/public/pwa/apple-touch-icon-180x180.png similarity index 100% rename from public/apple-touch-icon-180x180.png rename to public/pwa/apple-touch-icon-180x180.png diff --git a/public/maskable-icon-512x512.png b/public/pwa/maskable-icon-512x512.png similarity index 100% rename from public/maskable-icon-512x512.png rename to public/pwa/maskable-icon-512x512.png diff --git a/public/pwa-192x192.png b/public/pwa/pwa-192x192.png similarity index 100% rename from public/pwa-192x192.png rename to public/pwa/pwa-192x192.png diff --git a/public/pwa-512x512.png b/public/pwa/pwa-512x512.png similarity index 100% rename from public/pwa-512x512.png rename to public/pwa/pwa-512x512.png diff --git a/public/pwa-64x64.png b/public/pwa/pwa-64x64.png similarity index 100% rename from public/pwa-64x64.png rename to public/pwa/pwa-64x64.png diff --git a/vite.config.ts b/vite.config.ts index 08902e1c..4445a068 100644 --- a/vite.config.ts +++ b/vite.config.ts @@ -10,31 +10,36 @@ export default defineConfig({ VitePWA({ registerType: 'autoUpdate', injectRegister: 'auto', + strategies: 'injectManifest', + filename: 'firebase-messaging-sw.js', devOptions: { - enabled: true, + enabled: false, type: 'module' }, manifest: { + name: 'Moabam: 당신의 루틴을 지켜요!', + short_name: 'Moabam', + description: '성취감과 의무감을 더하는 루틴 관리 웹 앱', theme_color: '#60D4DE', icons: [ { - src: 'pwa-64x64.png', + src: 'pwa/pwa-64x64.png', sizes: '64x64', type: 'image/png' }, { - src: 'pwa-192x192.png', + src: 'pwa/pwa-192x192.png', sizes: '192x192', type: 'image/png' }, { - src: 'pwa-512x512.png', + src: 'pwa/pwa-512x512.png', sizes: '512x512', type: 'image/png', purpose: 'any' }, { - src: 'maskable-icon-512x512.png', + src: 'pwa/maskable-icon-512x512.png', sizes: '512x512', type: 'image/png', purpose: 'maskable'