ServiceWorkerGlobalScope.onpush

ServiceWorkerGlobalScope インターフェースの ServiceWorkerGlobalScope.onpush イベントは、Service Worker がプッシュサーバー経由でメッセージを受け取るたびに発火します。

構文

ServiceWorkerGlobalScope.onpush = function(PushEvent) { ... }
self.addEventListener('push', function(PushEvent) { ... })

次の例では、PushEvent からデータを取得して、すべての Service Worker のクライアント上で表示しています。プッシュメッセージのデータペイロードは、イベントオブジェクトの data プロパティ(PushEvent.dataPushMessageData オブジェクトを含みます。)で利用できます。

self.addEventListener('push', function(event) {
 if (!(self.Notification && self.Notification.permission === 'granted')) {
   return;
 }

 var data = {};
 if (event.data) {
   data = event.data.json();
 }
 var title = data.title || "Something Has Happened";
 var message = data.message || "Here's something you might want to check out.";
 var icon = "images/new-notification.png";

 var notification = new Notification(title, {
   body: message,
   tag: 'simple-push-demo-notification',
   icon: icon
 });

 notification.addEventListener('click', function() {
   if (clients.openWindow) {
     clients.openWindow('https://example.blog.com/2015/03/04/something-new.html');
   }
 });
});

仕様

仕様 ステータス コメント
Push API
onpush の定義
草案 初期定義。このイベントは ServiceWorkerGlobalScope からアクセスしますが、Push API で定義されています。

ブラウザー実装状況

機能ChromeEdgeFirefoxInternet ExplorerOperaSafari
基本対応40 ?441 なし24 なし
機能Android webviewChrome for AndroidEdge mobileFirefox for AndroidOpera AndroidiOS SafariSamsung Internet
基本対応4040 ?4424 なし4.0

1. Service workers (and Push) have been disabled in the Firefox 45 and 52 Extended Support Releases (ESR).

関連項目

ドキュメントのタグと貢献者

このページの貢献者: Potappo, YuichiNukiyama
最終更新者: Potappo,