https://www.redactie24.be/firebase-messaging-sw

1import { initializeApp } from 'https://www.gstatic.com/firebasejs/10.7.1/firebase-app.js'
2import { getMessaging, onBackgroundMessage } from 'https://www.gstatic.com/firebasejs/10.7.1/firebase-messaging-sw.js'
3
4const app = initializeApp({
5  "apiKey": "AIzaSyADg3iGxA9xqhUt7bWDyTsBNdzE3QDBrGk",
6  "authDomain": "redactie24-fdfaa.firebaseapp.com",
7  "databaseURL": "https://redactie24-fdfaa.firebaseio.com",
8  "projectId": "redactie24-fdfaa",
9  "storageBucket": "redactie24-fdfaa.appspot.com",
10  "messagingSenderId": "1039450480992",
11  "appId": "1:1039450480992:web:a911e8a3b5776b7d7afe05"
12});
13
14const messaging = getMessaging(app);
15
16self.addEventListener('notificationclick', function(event) {
17  let url = event.notification.data.url;
18
19  event.notification.close(); // Android needs explicit close.
20  event.waitUntil(
21    clients.matchAll({type: 'window'}).then( windowClients => {
22      // Check if there is already a window/tab open with the target URL
23      for (var i = 0; i < windowClients.length; i++) {
24        var client = windowClients[i];
25
26        // If so, just focus it.
27        if (client.url === url && 'focus' in client) {
28          return client.focus();
29        }
30      }
31
32      // If not, then open the target URL in a new window/tab.
33      if (clients.openWindow) {
34        return clients.openWindow(url);
35      }
36    })
37  );
38});
39
40onBackgroundMessage(messaging, function (payload) {
41  const notificationTitle = payload.data.title;
42
43  const notificationOptions = {
44  body: payload.data.body,
45  icon: '/sites/redactie24/themes/redactie_24/app/apple-icon-120.png',
46  image: payload.data.image,
47  data: {url: payload.data.url},
48  actions: [{action: "open_url", title: "Lees nu"}]
49  };
50
51  return self.registration.showNotification(notificationTitle, notificationOptions);
52});