The notifications in the foreground and according to the plan only reach me through the console, everything is fine, but the notification window is not shown and when I close the page the sale does not appear, what is the reason?
thank you so much for the guide, i got it to work the same as you at 9:15 but my project uses laravel as back-end so is there a code or place you know that i can read up on how to set up on that side ? im using axios to connect between the two, the firebase setting does not have code for php it would seems
Thanks for your comment, I'm glad it was helpful! I think there is no official Firebase Admin SDK for PHP. Instead, you need to use REST: firebase.google.com/docs/reference/fcm/rest/v1/projects.messages/send You can use cURL in PHP to interact with it Check out this Gist: gist.github.com/benixal/59c5be11d1f67502698decf0c80e2cf2
Firebase service worker does not show background notifications when the page is focused. Try using this simple javascript service worker: gist.github.com/benixal/80440dcec49f71c4423f428e27e7ad6f#file-firebase-messaging-sw-js
This is great, thanks. Now what if I want to use Capacitor to turn this Vue.js app into an ios/android mobile app? Will it just work, or is there an entirely different process?
same question "worked for you with a capacitor?" i'm doing app with vue.js (capacitor) do you find any solution to send push notification via firebase?
@@benixal you are currently running in browser. What if we build an android .apk file and install apk in my mobile. Will the notification still be sent?
For Firefox: "I tested this method on Firefox and did not encounter any issues. Could you please provide more information on the error you are seeing in the console?" For Safari: "The push API may not work on older versions of Safari. To send push notifications on Safari, you may need to use the Apple Push Notification Service (APNs). However, according to Apple, Safari 16 and newer versions will support the push API. I have not tested this yet." firebase.google.com/docs/web/environments-js-sdk#browsers caniuse.com/push-api
@@benixal thanks for the reply, my bad. on firefox its probably because i tested it on localhost still, i read somewhere it says has to be on https. thanks
Each token is only for one user , but if you want to send message to all users , you can send it to topics : firebase.google.com/docs/cloud-messaging/js/topic-messaging
Yes, it's safe The Firebase config, including apiKey, identifies your project; it's not a security risk if known. stackoverflow.com/questions/37482366/is-it-safe-to-expose-firebase-apikey-to-the-public firebase.google.com/docs/cloud-messaging/js/receive?hl=en&authuser=0#web-namespaced-api
Thank you, finally managed to get this to work! Is there any way to toggle a "Heads up" notification on Android devices? I can see it in my notification center, but currently it doesnt generate a popup notification or show on lock screen. Any idea? :)
Hi, thank for your share - thank you very much, i did it, but i have one question, if i standing at localhost web then send noti, i cant get noti instead firebase-admin already push, buts if i go to other url then i get noti, Did i do something wrong ? Many thank you
Hi thanks for your comment , your welcome! that's because the Firebase default service worker does not show background notifications when the page is focused. (Instead, it sends a payload directly to your app) and you need to handle the display within your application: onMessage(messaging, (payload) => { console.log('Message received. ', payload); // Display the message using your app's elements. // For example, pop a div or use other UI elements. }); However if you want to show push notifications even when the user is on the focused screen, Try using this simple javascript service worker instead of what I did in video: gist.github.com/benixal/80440dcec49f71c4423f428e27e7ad6f#file-firebase-messaging-sw-js (don't forget to clear the browser cache or update the service worker through devtools for the changes to take effect)
Salvaste mi vida, mi carrera universitaria, todo viejo... MUCHAS GRACIAS!!!
Thank you so much for your kind words! I'm glad the video was helpful to you.
The notifications in the foreground and according to the plan only reach me through the console, everything is fine, but the notification window is not shown and when I close the page the sale does not appear, what is the reason?
Bro you have no idea how much you helped me. Thanks a lot, I subscribed, please make more Vue.js + Firebase videos
Thank you so much! I'm glad the video helped you. More Vue.js + Firebase content is on the way, so stay tuned! 🚀
nice tutorial it helped me today with nuxt3 integration
Thanks for your comment, Glad it helped 😀 👍
Thank you so much! you help me and your instruction very, very clear i subbed ofc
thank you so much for the guide, i got it to work the same as you at 9:15 but my project uses laravel as back-end so is there a code or place you know that i can read up on how to set up on that side ? im using axios to connect between the two, the firebase setting does not have code for php it would seems
Thanks for your comment, I'm glad it was helpful!
I think there is no official Firebase Admin SDK for PHP.
Instead, you need to use REST:
firebase.google.com/docs/reference/fcm/rest/v1/projects.messages/send
You can use cURL in PHP to interact with it
Check out this Gist:
gist.github.com/benixal/59c5be11d1f67502698decf0c80e2cf2
You are the boss ! thank you
Thank you so much! I'm glad the video was helpful for you.
Thank you so much! I've watched many videos and could not understand how to do this with firebase's docs
Thank you for your kind words! I'm glad you found the video helpful.
THANK YOUUUU LOVE YOU BROOOO 💥💥💥💥💥💥💥
Thanks! 🙌 Glad the video was useful to you.
Does it works in PWA's? Using VUE 2.
iam implementing these steps in nuxt 3 but i get that error (A bad HTTP response code (404) was received when fetching the script.) any help please
background notifications aren't showing up, I get the console log when I focus the page, but no notification popup
Firebase service worker does not show background notifications when the page is focused. Try using this simple javascript service worker: gist.github.com/benixal/80440dcec49f71c4423f428e27e7ad6f#file-firebase-messaging-sw-js
Thank you so much!
This is great, thanks. Now what if I want to use Capacitor to turn this Vue.js app into an ios/android mobile app?
Will it just work, or is there an entirely different process?
Thank you!
I'm not familiar with Capacitor , I'm not sure
worked for you with a capacitor?
same question "worked for you with a capacitor?" i'm doing app with vue.js (capacitor) do you find any solution to send push notification via firebase?
@@benixal you are currently running in browser. What if we build an android .apk file and install apk in my mobile. Will the notification still be sent?
do you know why this method only works on chrome? i tested on safari and firefox they both don't work
For Firefox:
"I tested this method on Firefox and did not encounter any issues. Could you please provide more information on the error you are seeing in the console?"
For Safari:
"The push API may not work on older versions of Safari. To send push notifications on Safari, you may need to use the Apple Push Notification Service (APNs). However, according to Apple, Safari 16 and newer versions will support the push API. I have not tested this yet."
firebase.google.com/docs/web/environments-js-sdk#browsers
caniuse.com/push-api
@@benixal thanks for the reply, my bad. on firefox its probably because i tested it on localhost still, i read somewhere it says has to be on https. thanks
thanks bro
Thank you from here to sky
Thank you for your comment, I'm glad you found the video helpful.
The notification doesn't seems to be received on ios. (standalone/fullscreen mode)
Do you know why ?
Thanks for letting me know. I haven't tested it on iOS yet.
This is working everywhere, except on ios :(@@benixal
Is target tocken is for only one user or all users ?
Each token is only for one user , but if you want to send message to all users , you can send it to topics :
firebase.google.com/docs/cloud-messaging/js/topic-messaging
@@benixal thank you
hi
is it safe to put the file in public where the file has the FCM keys?
Hi! Yes, it's safe to put the file with the public VAPID key in public. Just remember to keep the private key secure and never share it publicly.
@@benixal thanks
@@benixal Sir, is it safe to include the firebase config in service worker?
Yes, it's safe
The Firebase config, including apiKey, identifies your project; it's not a security risk if known.
stackoverflow.com/questions/37482366/is-it-safe-to-expose-firebase-apikey-to-the-public
firebase.google.com/docs/cloud-messaging/js/receive?hl=en&authuser=0#web-namespaced-api
Thanks so much!
You're welcome!
Thank you, finally managed to get this to work! Is there any way to toggle a "Heads up" notification on Android devices? I can see it in my notification center, but currently it doesnt generate a popup notification or show on lock screen. Any idea? :)
i guess you need to run it on standalone mode (pwa installed on the device)
awesome thanks
Thanks! 😊👍
you are a god friend
Thank you! I'm glad the video was helpful to you.
Perfect
You're welcome! 🙌
Hi, thank for your share - thank you very much, i did it, but i have one question, if i standing at localhost web then send noti, i cant get noti instead firebase-admin already push, buts if i go to other url then i get noti, Did i do something wrong ? Many thank you
Hi thanks for your comment , your welcome!
that's because the Firebase default service worker does not show background notifications when the page is focused.
(Instead, it sends a payload directly to your app)
and you need to handle the display within your application:
onMessage(messaging, (payload) => {
console.log('Message received. ', payload);
// Display the message using your app's elements.
// For example, pop a div or use other UI elements.
});
However if you want to show push notifications even when the user is on the focused screen,
Try using this simple javascript service worker instead of what I did in video:
gist.github.com/benixal/80440dcec49f71c4423f428e27e7ad6f#file-firebase-messaging-sw-js
(don't forget to clear the browser cache or update the service worker through devtools for the changes to take effect)
Bro is Steve Wozniak's Father