erhalten und zeigen Push-Daten von Serviceworker in Chrom

Question

Ich benutze Pushwoosh für den Empfang von Push-Benachrichtigungen in meiner Web-App. alle Dinge gut funktioniert und Push-Nachricht in Serviceworker Hörer empfangen, aber ich möchte Push messge Daten von Serviceworker und verarbeiten sie in einem anderen js Klasse

main.js wie folgt geben:

if ('serviceWorker' in navigator) { 
    console.log('Service Worker is supported'); 
    navigator.serviceWorker.register('sw.js').then(function() { 
    return navigator.serviceWorker.ready; 
    }).then(function(reg) { 
    console.log('Service Worker is ready :^)', reg); 
     // TODO 
    }).catch(function(error) { 
    console.log('Service Worker error :^(', error); 
    }); 
} 

// get push message data in main.js and process it 

Servicemitarbeiter wie folgt aus:

self.addEventListener('push', function(event) { 
    console.log('Push message', event); 

    var title = 'Push message'; 

    event.waitUntil(
    self.registration.showNotification(title, { 
     'body': 'The Message', 
     'icon': 'images/icon.png' 
    })); 
}); 

Answer 1

Wie ich in einem Kommentar erwähnt, scheint dies einen etwas seltsamen anwendungs~~POS=TRUNC für einen Dienst Arbeitnehmer eher als ein Standard-Arbeiter, aber:

Sie können veranlassen, dass Ihr Servicemitarbeiter eine Nachricht an alle verbundenen Clients sendet, wenn eine Nachricht an ihn gesendet wird.

This answer zeigt ein komplettes Beispiel eines Servicemitarbeiters der Kunden zu sprechen, aber im Grunde:

1. Die Seiten es für Nachrichten hören verwaltet:

   navigator.serviceWorker.addEventListener('message', event => { 
       // use `event.data` 
   }); 
   

2. Der Service Arbeiter sie

   sendet wie dies:

   self.clients.matchAll().then(all => all.forEach(client => { 
       client.postMessage(/*...message here...*/); 
   })); 
   

Oder mit ES5 und früheren Syntax (aber ich glaube nicht, alle Browser unterstützt Service-Mitarbeiter Pfeil Funktionen nicht unterstützt auch):

Seite Zuhören:

navigator.serviceWorker.addEventListener('message', function(event) { 
    // use `event.data` 
}); 

Arbeiter zu senden:

self.clients.matchAll().then(function(all) { 
    all.forEach(function(client) { 
     client.postMessage(/*...message here...*/); 
    }); 
});