40

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

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

ここに投稿された提案を既に試しました https://disqus.com/home/discussion/html5rocks/push_notifications_on_the_open_web/
しかし、今まで役立つものを見つけることができませんでした. 何か提案はありますか？

4

6 に答える 6

31

私は同じ問題を経験していましたが、長い調査の結果、これは 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
                  })
              });
          })
      );
  });
于 2015-08-19T11:57:53.183 に答える
18

私は過去にこの問題に遭遇しました。私の経験では、原因は一般的に次の 3 つの問題のいずれかです。

  1. プッシュ メッセージへの応答として通知が表示されていません。デバイスでプッシュ メッセージを受信するたびに、イベントの処理が終了すると、通知がデバイスに表示されたままになる必要があります。これは、userVisibleOnly: trueオプションを使用してサブスクライブするためです (ただし、これはオプションではなく、設定しないとサブスクリプションが失敗することに注意してください。
  2. event.waitUntil()イベントの処理に応答して呼び出しているわけではありません。Promise をこの関数に渡して、通知が表示されたままかどうかを確認する前に、Promise が解決されるまで待つ必要があることをブラウザーに示す必要があります。
  3. event.waitUntil何らかの理由で、通知が表示される前に渡された約束を解決しています。これself.registration.showNotificationは promise であり非同期であるため、渡された promise が解決される前に解決されていることを確認する必要がありますevent.waitUntil。
于 2016-01-04T14:02:53.373 に答える
16

通常、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 からプッシュ メッセージを受信したにもかかわらず、何らかの理由でプッシュ通知をスキップし、「このサイトはバックグラウンドで更新されました」などのデフォルト メッセージを含むプッシュ通知を受信する場合があります。

于 2015-07-02T09:41:42.953 に答える
4

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

まじめな話ですが、 developers.google.comの Matt Gaunt に感謝します。

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);
});
于 2018-02-21T08:14:11.347 に答える