Firebase notification when tab is not in focus

Question

I implemented a firebase push notification on my web, I wanted to trigger a function and play a sound when receive a push, My code is working fine when the web page is on focus but when its on the background it only shows me a pop up for that notification and the function is not trigger

Here is my code:

  messaging.onMessage(function(payload){
    $( "#reload" ).trigger( "click" );
    var audio = new Audio('************************.mp3');
    audio.play();
    console.log('onMessage',payload);

  });

Answer 1

From the Firebase documentation on Handle messages when your web app is in the background :

All messages received while the app is in the background trigger a display notification in the browser. You can specify options for this notification, such as title or click action, either in the send request from your app server, or using service worker logic on the client.

You can set your own background handler for data messages with messaging.setBackgroundMessageHandler(...) . But that handler will be running in a service worker, so won't be able to play sound. For an example of this, see Setting notification options in the service worker .