web-dev-qa-db-ja.com

firebaseクラウドメッセージング：setBackgroundMessageHandlerが呼び出されない

FCMでブラウザープッシュ通知のプロトタイプを作成しています。クイックスタートからサンプルコードをコピーしました（ https://github.com/firebase/quickstart-js/tree/master/messaging ）。メッセージは必要に応じて受信および表示されます。しかし、Service Worker（messaging.setBackgroundMessageHandler）でメッセージを変更しようとしても何も起こりません。 Service Workerが呼び出され、Push通知用にそのService Workerにイベントリスナーを実装すると、イベントをキャッチします。ただし、メソッドsetBackgroundMessageHandlerは呼び出されません。私はこれをChrome 54。

Service Workerでメッセージをカスタマイズするために必要なアイデアはありますか？

どうもありがとうございました！

firebasefirebase-cloud-messagingservice-worker
16
Mathias

同じ問題を経験している人のために、ここに答えがあります： https://github.com/firebase/quickstart-js/issues/71

短い要約：JSONメッセージに「通知」要素を含めないでください。

42
Mathias

これは、webappで私のために働いたソリューションです。タイトルと本文のテキストとともに画像とともに通知を表示し、ユーザーのクリックを処理します。

firebase-messaging-sw.js

importScripts('https://www.gstatic.com/firebasejs/4.8.1/firebase-app.js');
importScripts('https://www.gstatic.com/firebasejs/4.8.1/firebase-messaging.js');

// Initialize Firebase
var config = {
  apiKey: "YOUR_API_KEY",
  authDomain: "YOUR_AUTH_DOMAIN",
  databaseURL: "YOUR_DB_URL",
  projectId: "YOUR_PROJ_ID",
  storageBucket: "YOUR_STORAGE_BUCKET",
  messagingSenderId: "YOUR_SENDER_ID"
};
firebase.initializeApp(config);
const messaging = firebase.messaging();
messaging.setBackgroundMessageHandler(function (payload) {
  console.log('Handling background message ', payload);

  return self.registration.showNotification(payload.data.title, {
    body: payload.data.body,
    icon: payload.data.icon,
    tag: payload.data.tag,
    data: payload.data.link
  });
});

self.addEventListener('notificationclick', function(event) {
  event.notification.close();
  event.waitUntil(self.clients.openWindow(event.notification.data));
});

JSONメッセージ

{
"message": {
    "token": "YOUR_TARGET_APP_TOKEN",
    "data": {
        "title": "FCM Message",
        "body": "This is an FCM Message",
        "icon": "https://shortcut-test2.s3.amazonaws.com/uploads/role_image/attachment/10461/thumb_image.jpg",
        "link": "https://yourapp.com/somewhere"
    }
}

}

2
Sparm

プッシュメッセージを送信しようとするとき、アプリにフォーカスがあるときに送信しますか？なぜなら、ドキュメントから、setBackgroundMessageHandlerはWebアプリが閉じているか、ブラウザーフォーカスがないときにのみ呼び出されると書かれているからです。

クイックスタートのサンプルコードに基づいています（ https://github.com/firebase/quickstart-js/tree/master/messaging ）。

アプリにフォーカスがある場合：プッシュメッセージは、index.htmlのmessaging.onMessage（）を介して受信されます
アプリにフォーカスがない場合：プッシュメッセージは、サービスワーカーファイルのsetBackgroundMessageHandler（）を介して受信されます。

1
River Paul