2016-11-07 7 views
7

私はFCMでブラウザのプッシュ通知をプロトタイプ作成しています。クイックスタート(https://github.com/firebase/quickstart-js/tree/master/messaging)のサンプルコードをコピーしました。メッセージは受信され、表示されるはずです。しかし、サービスワーカー(messaging.setBackgroundMessageHandler)のメッセージを変更しようとすると何も起こりません。サービスワーカーが呼び出され、プッシュ通知のためにそのサービスワーカーにイベントリスナーを実装すると、イベントがキャッチされます。しかし、setBackgroundMessageHandlerメソッドは呼び出されません。 Chromeでこれを試しています。firebaseクラウドメッセージング:setBackgroundMessageHandlerが呼び出されない

サービスワーカーでメッセージをカスタマイズするために必要なことは何ですか?

ありがとうございました!

答えて

1

プッシュメッセージを送信しようとすると、アプリのフォーカスが合っているかどうかを確認していますか?ドキュメントから、setBackgroundMessageHandlerは、ブラウザのフォーカスがのWebアプリケーションが閉じられている場合にのみ呼び出されると記載されています。

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

あなたのアプリにフォーカスがある場合:プッシュメッセージがindex.htmlを上messaging.onMessage()を介して受信される
あなたのアプリがフォーカスを持っていない場合:プッシュメッセージがtehのサービスワーカーにsetBackgroundMessageHandler()を介して受信されますファイル。同じ問題を経験した人のため

+0

申し訳ありません。これについて言及するのを忘れてしまった:それはうまく動作し、onMessageメソッドが呼び出され、私はメッセージで欲しいものを行うことができます。ページにフォーカスがない場合、通知は表示されますが、決して呼び出されないので、setBackgroundMessageHandlerメソッド内で通知をカスタマイズすることはできません。 – Mathias

22

は、ここで答えです:https://github.com/firebase/quickstart-js/issues/71

短い要約:あなたのJSONメッセージに「通知」の要素が含まれていません。

+0

これは私の人生を救った。なぜ私のハンドラが呼び出されていないのかを理解しようとすると、私は文字通り「クレイジー」になっていました。 –

+0

同じです、ありがとう! –

+0

非常に役に立ちます。ありがとう:) –

0

これはwebappで私のために働いた解決策です。それはタイトルと本文の画像とともに通知を表示し、ユーザーのクリックを処理します。

firebaseメッセージング-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" 
    } 
} 

}

関連する問題