Push Notifications to Your Web Application in Browser Using Google Firebase (Cloud Messaging)

Thanks for sharing this! Great tutorial. Anyone struggling to see the test notification, having added a blank 'firebase-messaging-sw.js', look at your Mac OS settings (if on a mac) as you may be blocking your notifications in other ways.

hey bro, thank you so much for this video <3

This code still work? because I have had problem with the browser chrome to get push notification? anyone knows or have the solution?

where is your firebase-messaging-sw.js file

Does this work on safari 16 ? As safari 16 now supports the push messaging.
For me on safari, I does get the notifications, but after 3 notifications, it revokes the permission, I need to go again with the workflow of requesting the permission.

Even when I am showing the notification, it revokes the permission

Does this work on safari 16 ? As safari 16 now supports the push messaging.
For me on safari, I does get the notifications, but after 3 notifications, it revokes the permission, I need to go again with the workflow of requesting the permission.

Even when I am showing the notification, it revokes the permission.

Doesn´t work... I get the token I can paste it into firebase but he notification doesn´t show up.

I set up a foreground listener on react, and i can see the notification in developer console, but the listener doesnt console the payload as it should. Anyone experience this?

Came for the tutorial; stayed for the music! 🔥

Hi, thank you for the tutorial, it all worked out except for the last part: the notification itself. I already tried closing the localhost site, allowing to display notifications, and it still doesnt work. Hope you can help me out on this :(

Howdy, i found your clip very helpful however i'm getting the error
FirebaseError: Messaging: We are unable to register the default service worker. The answers i've looked for in stack overflow all point out that i need to move it inside the public folder but if i move it inside the public folder i get the error saying i can't import stuff outside the src directory and this seems to be a create-react-app issue. Do you know of a fix for this, thanks in advance!

really really thanks. I want to get use to reading documentation / learn to learn through documentation. documentation are alway scary and intimidating. but following this tutorial help me to tackle future problems as well. if you like to make more on firebase, I would love to see it as well.

many thanks for the github repo

Here for me it keeps warning that Notification permission granted however, the whole page hangs, and the key does not appear... What can it be?

`Notification is not defined` - Can u help me ?? pls , thanks

Thanks! Helped me out

I `ve got the register token but i cannot receive notification. Please help me

How to add push notifications on other people's websites? Thank you

this is my error: An error occurred while retrieving token. FirebaseError: Messaging: We are unable to register the default service worker. (how can i fixed it)

Hey, thanks for your tutorial. I got the key and allowed notification, but didn't get the message when sending a test message from firebase. Do you know what the reason is?

thank you so much sir

I needed some help in this. I have followed the same steps as you have, but I am not getting the notification. I have even cloned your code and made the necessary changes about the config and the vapid key, but still I am not getting any notifications. gcm-internal shows that there is some data that is received.