|
@ -49,7 +49,38 @@ function askPermission(): Promise<NotificationPermission> { |
|
|
If the user grants permission, the client application registers a service worker using |
|
|
If the user grants permission, the client application registers a service worker using |
|
|
the ServiceWorkerRegistration API. |
|
|
the ServiceWorkerRegistration API. |
|
|
|
|
|
|
|
|
<Add Service Worker Notes> |
|
|
|
|
|
|
|
|
Here's a version which can be used for testing locally. Note there can be |
|
|
|
|
|
caching issues in your browser! Incognito is highly recommended. |
|
|
|
|
|
|
|
|
|
|
|
self.addEventListener('push', function(event: PushEvent) { |
|
|
|
|
|
console.log('Received a push message', event); |
|
|
|
|
|
|
|
|
|
|
|
const title = 'Push message'; |
|
|
|
|
|
const body = 'The message body'; |
|
|
|
|
|
const icon = '/images/icon-192x192.png'; |
|
|
|
|
|
const tag = 'simple-push-demo-notification-tag'; |
|
|
|
|
|
|
|
|
|
|
|
event.waitUntil( |
|
|
|
|
|
self.registration.showNotification(title, { |
|
|
|
|
|
body: body, |
|
|
|
|
|
icon: icon, |
|
|
|
|
|
tag: tag |
|
|
|
|
|
}) |
|
|
|
|
|
); |
|
|
|
|
|
}); |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
vue.config.js |
|
|
|
|
|
|
|
|
|
|
|
module.exports = { |
|
|
|
|
|
pwa: { |
|
|
|
|
|
workboxOptions: { |
|
|
|
|
|
importScripts: ['sw-dev.ts'] |
|
|
|
|
|
} |
|
|
|
|
|
} |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
In the next step, BROWSER requests a data structure from SERVICE called a VAPID (Voluntary |
|
|
In the next step, BROWSER requests a data structure from SERVICE called a VAPID (Voluntary |
|
|
Application Server Identification) which is the public key from a key-pair. |
|
|
Application Server Identification) which is the public key from a key-pair. |
|
|