Service Worker (sw) erstellen (js schript für einen hintergrundprozess)
serviceworker.js
```javascript
    self.addEventListener("push", (event) => {
    
        const notification = event.data.json();
        // {"body": "This is a notification", "title": "Hello", "url": "./?message=123", icon: "https://webpush.shopdemo-neofonie.de/asset/funny-icon-27.png"}
        event.waitUntil(self.registration.showNotification(notification.title, {
            body: notification.body,
            icon: notification.icon,
            url: notification.url
        }));
    });
    
    self.addEventListener("notificationclick", (event) => {
        event.waitUntil(clients.openWindow(event.notification.data));
    });
```

sw registrieren index.html
```javascript
    if ('serviceWorker' in navigator) {
        navigator.serviceWorker.register('./serviceworker.js').then(function(registration) {
            console.log('Service Worker registered with scope:', registration.scope);
            // abfrage ob user notifications erlaubt
            window.setTimeout(enableNotifications, 5000);
        }).catch(function(error) {
            console.log('Service Worker registration failed:', error);
        });
    } else {
        console.log('Service Workers are not supported.');
    }
```

Notification Berechtigung anfordern und Subscripten zum Server senden
``` javascript
    function enableNotifications() {
        console.log('start enable notification process');
    
    
        if (!("Notification" in window)) {
            // Check if the browser supports notifications
            console.log("This browser does not support desktop notification");
        } else if (Notification.permission === "granted") {
            // Check whether notification permissions have already been granted;
            // if so, create a notification
            // const notification = new Notification("Hi there!");
            console.log('notification already granted');
        } else if (Notification.permission !== "denied") {
            // We need to ask the user for permission
            console.log('notification not deny, so we can ask for permission');
            Notification.requestPermission().then((permission) => {
                if (permission === 'granted') {
                    navigator.serviceWorker.ready.then((sw) => {
                        sw.pushManager.subscribe({
                            userVisibleOnly: true,
                            // server key - einmalig generiert mit vapid.php
                            applicationServerKey: "BHdKiS8scWiOlr6yTWaR_csim14mu8JOUVoiZIEg7J3s1jBBeo3oGNK8JNy7VZ9vic_XOREASFK3u3GAPmtiDew"
                        }).then((subscription) => {
                            console.log('Subscribed:', JSON.stringify(subscription));
    
                            // send subscription to server
                            sendSubscriptionToServer(subscription);
                        });
                    });
                }
            });
        }
    
    
    }
    
    
    function sendSubscriptionToServer(subscription) {
        fetch('https://webpush.shopdemo-neofonie.de/addSubscription.php', {
            method: 'POST',
            headers: {
                'Content-Type': 'application/json'
            },
            body: JSON.stringify(subscription)
        }).then((response) => {
            if (!response.ok) {
                console.error('[error] Failed to send subscription to server.');
            }
            console.log('subscription sent to server');
        });
    }
```