web-dev-qa-db-ja.com

Chromeプッシュ通知：このサイトはバックグラウンドで更新されました

chromeプッシュ通知を実装している間、サーバーから最新の変更を取得していました。その間、サービスワーカーはメッセージとともに追加の通知を表示しています

このサイトはバックグラウンドで更新されました

すでにここに投稿された提案で試してみました https://disqus.com/home/discussion/html5rocks/Push_notifications_on_the_open_web/
しかし、これまで有用なものは見つかりませんでした。提案はありますか？

google-chromepush-notificationweb-pushpush-api
28
Md. Mashiur Rahman Chowdhury

通常、GCM（Google Cloud Messaging）からプッシュメッセージを受信したらすぐに、ブラウザーにプッシュ通知を表示する必要があります。これは、ここの3番目のポイントで言及されています。

https://developers.google.com/web/updates/2015/03/Push-notificatons-on-the-open-web#what-are-the-limitations-of-Push-messaging-in- chrome-42

そのため、GCMからプッシュメッセージを取得しているにもかかわらず、何らかの理由でプッシュ通知をスキップし、「このサイトはバックグラウンドで更新されました」などのデフォルトメッセージを含むプッシュ通知を取得することがあります。

12
Satyajit Dey

私は同じ問題を経験していましたが、長い調査の後、これはPushイベントとself.registration.showNotification（）の間に遅延が発生するためだとわかりました。 self.registration.showNotification（）の前にreturnキーワードを見逃した

そのため、通知を取得するには次のコード構造を実装する必要があります。

var APILINK = "https://xxxx.com";
 self.addEventListener('Push', function(event) {
      event.waitUntil(
          fetch(APILINK).then(function(response) {

        return response.json().then(function(data) {
                  console.log(data);
                  var title = data.title;
                  var body = data.message;
                  var icon = data.image;
                  var tag = 'temp-tag';
                  var urlOpen = data.URL;

                return  self.registration.showNotification(title, {
                      body: body,
                      icon: icon,
                      tag: tag
                  })
              });
          })
      );
  });
25
Yogendra

私は過去にこの問題に遭遇しました。私の経験では、原因は一般に3つの問題のうちの1つです。

  1. プッシュメッセージへの応答として通知を表示していません。デバイスでプッシュメッセージを受信するたびに、イベントの処理が終了したら、通知をデバイスに表示したままにしておく必要があります。これは_userVisibleOnly: true_オプションを使用してサブスクライブするためです（ただし、これはオプションではなく、設定しないとサブスクリプションが失敗することに注意してください）。
  2. イベントの処理に応答してevent.waitUntil()を呼び出していません。通知が表示されたままになっているかどうかを確認する前に、Promiseが解決するのを待つ必要があることをブラウザに示すために、Promiseをこの関数に渡す必要があります。
  3. 何らかの理由で、通知が表示される前に_event.waitUntil_に渡されたプロミスを解決しています。 _self.registration.showNotification_はプロミスおよび非同期であるため、_event.waitUntil_に渡されたプロミスが解決される前に解決されていることを確認する必要があります。
13
owencm

これは機能し、コピー/貼り付け/変更だけです。 「return self.registration.showNotification（）」を以下のコードに置き換えます。最初の部分は通知を処理することであり、2番目の部分は通知のクリックを処理することです。しかし、私が何時間もグーグルで答えてくれたことに感謝しない限り、私に感謝しないでください。

しかし、真剣に、すべてのおかげで developers.google.com

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

  var title = 'Yay a message.';
  var body = 'We have received a Push message.';
  var icon = 'YOUR_ICON';
  var tag = 'simple-Push-demo-notification-tag';
  var data = {
    doge: {
        wow: 'such amaze notification data'
    }
  };

  event.waitUntil(
    self.registration.showNotification(title, {
      body: body,
      icon: icon,
      tag: tag,
      data: data
    })
  );
});

self.addEventListener('notificationclick', function(event) {
  var doge = event.notification.data.doge;
  console.log(doge.wow);
});
1
user5803705

プッシュ通知イベントの受信時にもっと多くのことが必要な場合、showNotification()はPromiseを返します。したがって、クラシックチェーンを使用できます。

const itsGonnaBeLegendary = new Promise((resolve, reject) => {
    self.registration.showNotification(title, options)
        .then(() => {
            console.log("other stuff to do");

            resolve();
        });
});

event.waitUntil(itsGonnaBeLegendary);
1
Vitezslav Lindovsky