Firebase receive notification while tab is active or on focus

What i want is to be able to perform an action when a user receives a notification while the browser is open and tab is active or focused. I can seem to figure out a way to receive notification or perform am action while browser tab is open or focused, It works well when browser is at the background.I upgraded to firebase version 7.8.0 and below is the code am using

// Your web app's Firebase configuration
var firebaseConfig = {
apiKey: "xxxx",
authDomain: "xxx",
databaseURL: "xxxxx",
projectId: "xxxx",
storageBucket: "xxx",
messagingSenderId: "xxx",
appId: "xxx"
// Initialize Firebase

if (!("Notification" in window)) {
console.error("Notification isn't enabled");
} else if (Notification.permission === "granted") {
console.log("Notification is enabled");
} else if (Notification.permission !== "denied") {

// Retrieve an instance of Firebase Messaging so that it can handle background
// messages.
const messaging = firebase.messaging();

messaging.onMessage((payload) => {
console.log('Message received. ', payload);
// ...

.then(function () {
// MsgElem.innerHTML = "Notification permission granted."
//console.log("Notification permission granted.");

// get the token in the form of promise
return messaging.getToken()
.then(function(token) {
// print the token on the HTML page
//TokenElem.innerHTML = "token is : " + token
data:{token : token, _token: "<?php echo csrf_token(); ?>",UserId: },
//alert(data+"You will receive notiications from clients that viewed your service ");

.catch(function (err) {
//ErrElem.innerHTML = ErrElem.innerHTML + "; " + err
console.log("Unable to get permission to notify.", err);



from Newest questions tagged laravel-5 – Stack Overflow

Related Posts

Codeigniter : Parse error: syntax error, unexpected ‘const’ (T_CONST), expecting variable (T_VARIABLE) in Laravel project

I’m getting following error: **Parse error: syntax error, unexpected ‘const’ (T_CONST), expecting variable (T_VARIABLE)** Note : It’s working in local but facing issue in production server. private…

Laravel’s alias loader does not find class

We have a legacy project that we cannot update and we need to make some changes in symfony’s Response.php in vendor. We have solved this by copying…

Laravel 5 – generic document management

I have a system where you can create different types of unique documents. For instance, one document is called Project Identified and this expects certain inputs. Originally,…

Laravel Nova limit the results in indexQuery

I ran intro a situation where I need to limit the results of a resource to only 3 results. To be more specific, based on the logged…

Auditoria en laravel 5.8 [closed]

Cómo puedo automatizar el registro de actividades de un usuario en laravel? Si un usuario ingresa a un app de laravel, debo guardar toda su actividas, a…

AdonisJS – SyntaxError. Unexpected character ‘ ‘

I am trying to fetch all talent resource from the database but when I tried the endpoint on Postman, it returned a SyntaxError. Unexpected character ” error….

Leave a Reply

Your email address will not be published.