Otwórz niestandardowy adres URL po kliknięciu powiadomienia wypychania WWW

Question

Wprowadzam Webpush ruby gem do wysyłania powiadomień push do użytkowników mojej witryny.

kod serwera:

Webpush.payload_send({ 
     message: notification.message, 
     url: notification.url, # I can't figure out how to access this key 
     id: notification.id, # or this key from the service worker 
     endpoint: endpoint, 
     p256dh: p256dh_key, 
     vapid: vapid_keys, 
     ttl: 24 * 60 * 60, 
     auth: auth_key, 
    }) 

Mam pracownika Service Set up po stronie klienta, aby pokazać powiadomienia i uczynić go kliknąć.

self.addEventListener("push", function (event) { 
    var title = (event.data && event.data.text()) || "New Message"; 

    event.waitUntil(
    self.registration.showNotification(title, { 
     body: "New push notification", 
     icon: "/images/logo@2x.png", 
     tag: "push-notification-tag", 
     data: { 
     url: event.data.url, // This is returning null 
     id: event.data.id // And this is returning null 
     } 
    }) 
) 
}); 

self.addEventListener('notificationclick', function(event) { 
    event.notification.close(); 
    event.waitUntil(
    clients.openWindow(event.data.url + "?notification_id=" + event.data.id) 
); 
}) 

To wszystko działa dobrze, z wyjątkiem klawiszy niestandardowych (url, id), że jestem przejazdem nie są dostępne z poziomu pracownika serwisu.

Czy ktoś wie, jak przekazywać niestandardowe dane przez gem WebPush?

Answer 1

Wygląda na to, że z Webpush (with a payload) documentation należy umieścić wszystkie dane w wiadomości przy użyciu metody JSON.stringify() i pobrać je w serwisie serwisowym pod numerem JSON.parse().

Serwer:

Webpush.payload_send({ 
    message:JSON.stringify({ 
    message: notification.message, 
    url: notification.url, 
    id: notification.id, 
    }), 
    endpoint: endpoint, 
    p256dh: p256dh_key, 
    vapid: vapid_keys, 
    ttl: 24 * 60 * 60, 
    auth: auth_key, 
}) 

Klient:

event.waitUntil(
    self.registration.showNotification(title, { 
    body: "New push notification", 
    icon: "/images/logo@2x.png", 
    tag: "push-notification-tag", 
    data: { 
    url: JSON.parse(event.message).url 
    } 
}) 

Answer 2

Niestandardowe dane pochodzą event.notification obiektu nie w imprezy bezpośrednio (w notificationclick). Więc jeśli chcesz pobrać niestandardową zmienną danych w funkcji notifyclick, powinieneś zrobić to w ten sposób :)

self.addEventListener('notificationclick', function(event) { 
    event.notification.close(); 
    event.waitUntil(
    clients.openWindow(event.notification.data.url + "?notification_id=" + event.notification.data.id) 
); 
})