diff --git a/public/service-worker.js b/public/service-worker.js new file mode 100644 index 0000000..61bd075 --- /dev/null +++ b/public/service-worker.js @@ -0,0 +1,61 @@ +self.addEventListener('push', (event) => { + const data = event.data.json() + console.log('Push событие получено:', data.type) + + // Отображение уведомления + if (data.type === 'notification') { + event.waitUntil( + self.registration.showNotification(data.notification.title, data.notification.options).then( + () => { + console.log('Notification создан', data.notification.options.tag) + }, + (e) => { + console.error('Notification ошибка создания', e) + }, + ), + ) + } else if (data.type === 'cancelNotification') { + event.waitUntil( + self.registration + .getNotifications({ tag: data.notification.options.tag }) + .then((notifications) => { + notifications.forEach((notification) => { + if ( + notification.tag === data.notification.options.tag || + notification.data.payload.tag === data.notification.options.data.payload.tag // удалить, если notification.tag поддерживают все + ) { + notification.close() + console.log('Notification удален') + } + }) + }), + ) + } +}) + +self.addEventListener('notificationclick', (event) => { + event.notification.close() + + // Открытие URL из данных уведомления + event.waitUntil( + clients.matchAll({ type: 'window' }).then((clientList) => { + for (const client of clientList) { + if (client.url === event.notification.data.url && 'focus' in client) { + console.log('клик на уведомление', event.notification.tag) + + return Promise.all([ + client.focus(), + client.postMessage({ + type: 'notificationClick', + tag: event.notification.tag, + payload: event.notification.payload, + }), + ]) + } + } + if (clients.openWindow) { + return clients.openWindow(event.notification.data.url) + } + }), + ) +}) diff --git a/src/main.ts b/src/main.ts index 19bb5d1..d4e0923 100644 --- a/src/main.ts +++ b/src/main.ts @@ -29,6 +29,7 @@ const MyPreset = definePreset(Aura, { import App from './App.vue' import router from './router' +import { registerServiceWorker } from '@/registerServiceWorker' const app = createApp(App) @@ -48,4 +49,8 @@ app.use(PrimeVue, { app.mount('#app') +registerServiceWorker() + .then(() => console.log('Service Worker успешно зарегистрирован')) + .catch(console.error) + window.PouchDB = PouchDB // it for debug in console only diff --git a/src/registerServiceWorker.ts b/src/registerServiceWorker.ts new file mode 100644 index 0000000..210fbf0 --- /dev/null +++ b/src/registerServiceWorker.ts @@ -0,0 +1,14 @@ +export async function registerServiceWorker() { + if (!('serviceWorker' in navigator)) { + throw new Error('Ваш браузер не поддерживает Service Worker.') + } + + try { + const registration = await navigator.serviceWorker.register('/service-worker.js') + console.log('Service Worker зарегистрирован:', registration) + return registration + } catch (error) { + console.error('Ошибка регистрации Service Worker:', error) + throw error + } +}