Push Notifications with Firebase Cloud Messaging and Cordova FCM on Android
HTML-код
- Опубликовано: 19 май 2017
- My Learn Ionic 3 From Scratch Course - www.udemy.com/learn-ionic-3-f...
Support the content: / paulhalliday - EXCLUSIVE early access to the next video(s), as well as other benefits!
Push Notifications with Firebase Cloud Messaging and Cordova FCM on Android
In this video, we take a look at using the Cordova FCM plugin and Firebase Cloud Messaging to send push notifications for our device(s). This is an Android demo, but a similar set up is required for iOS.
The extra epic content always comes via email first. Sign up so you're not left behind: eepurl.com/cBCqO9
You can also find me:
/ pwhsoftware
/ paulhal 
Наука
Awesome video Paul!
Really looking forward to the push plugin and ios set up videos.
Hi Martin,
I'll be covering this soon in my new course. Here's a discount code.
Master Ionic 3 with Ionic Native and Cordova Integrations - www.udemy.com/master-ionic-3-with-ionic-native-and-cordova-integrations/?couponCode=IONICNATIVE
thanks dude. I really learn a lot from you.
Hi Paul
I am struggling with notification icons on oneSignal native plugin on android
I cant mannge to show the app icon when a push message is recieved
Can you add a good tutorial on this?
Thanks!
You are telling me perfectly, my teacher, thank you ...
thanks very much , it's very helpful video , and finally i got a notification on my app,
Note : notification only working on Physical device . on my case at least.
This is because only physical devices and emulators generate unique device ids. This form of notification implementation depends on device ids.
Hi man, great tutorial! So, how can I handle with the background notification? when I click in the notification bar my app doesn't execute my alert... thanks
Hi Paul. Im a huge fan and in fact bought your ionic 3 tutorial in udemy. Would you be able to do a quick tutorial on how to implement push notifications on nativescript? Cheers.
Hi paul! great tutorial. Can you do a tutorial using topic subscription? like a chat group app. Don't include to notify the user who sends the notification.
can you also create video on technique for showing/handling badges with FCM in android, as you know the recent versions of android support it!
there's a lot of cuts on the actual implementation --this isn't working just following those
Hallo Paul
Did you run this app on emulator or on real device on this video, another question i followed your step, but why i could not see declaration.d.ts file in my project? thanks in advance!
I also do not have that file in my project, is this tutorial made in an outdated ionic version?
is it possible to have the app constantly listen for it so that we can show it in the notification bar as it comes?
This code does that.
Hi Paul,
I am getting this error,
Error: cordova-plugin-fcm: You have installed platform android but file 'google
services.json' was not found in your Cordova project root folder. please help me out
Thank you very much!
Can u implement push notifications with ionic cloud?
Hi Paul,
The article is really great stuff.I am making use of ionic plugin add phonegap-plugin-push plugin.The application works absolutely great with push when it is in foreground mode.
But when we receive the push notification in background when app is not running it doesn't work.Could you please give your advise on this.I am using firebase as my Push messaging service
Thank you.
I'm having the same issue.
Looking for solution.
You may try the one signal plugin for the ionic2.I guess that will help you out.
you solved it eventually?
not working for me error say: FCMPlugin is not defined ReferenceError... What should i do? how to import this plugin? How can i use this plugin to my component? please help
EDIT: i'am using ionic version 3.9.2
I'm not using Ionic. Just plain Cordova CLI (notepad++ is my editor). After "Cordova run android", how to get the token in your video 4:40?
I got it. Have to use the FCM plugin function FCMPlugin.onTokenRefresh
hello paul can u pls help me with firebase as its not passing message from api (db mysql) though from console its sending messages
Hi, could you please do a video push notification with WordPress to ionic 2/3 and also on Social shear with ionic 2/3.
thanks.
+Mahmoud Tokura I'll be adding social sharing to the course at some point soon. Thanks!
Hi Paul,
I like your video tutorials and I got one questions on this one: Firebase handles push notifications when the app is open and in the foreground, open but in the background and completely close? What is the approach in these cases using Ionic Framework?
Thanks in advance.
Hi David,
I'm looking at more ways we can take advantage of Push notifications (with the native UI components too) very soon. This should allow the user to be alerted when a notification comes down the screen outside of the application.
I'm working on 'silent' notifications at the moment. They work fine on Android using this plugin, but are not at all happy on IOS (you have to change some additional settings in Xcode to allow push notifications and background messages in the 'capabilities' section). Even so, I don't think that this plugin handles silent notifications correctly on IOS ... if anyone knows better then please share!
I did get it to work (kind of) by fiddling about with the Objective C code in this plugin, but it wasn't a 100% working solution and I'm an utter beginner when it comes to Objective C. It's all in the 'didReceiveRemoteNotification' handler as far as I can tell. But as I say, my opinion about Objective C cannot be relied upon and I was just poking around in the dark ...
Real shame as push notifications that do not bother the user are a nice way to get your backgrounded app to contact your server for data updates (you get a strict time limit of 30 seconds to do this in IOS) ...
I'm having the same issue.
Glad if anyone can share the solution :D
I have now got this working nicely, but not using this plugin. This plugin lacks the necessary iOS native objective-c to allow the use of 'silent' notifications as far as I can tell (although I may be missing something). I did try forking the plugin and making some changes but frankly my objective-c is basically non-existent so what I ended up with was a very nasty bit of monkey patching and, quite frankly, guesswork. I ended up using the 'phonegap-plugin-push' (github.com/phonegap/phonegap-plugin-push) plugin instead. This does have Ionic Native support, too (ionicframework.com/docs/native/push/).
The 'phonegap-plugin-push' plugin *does* integrate with FCM, but it's not a walk in the park. However, it allows you to use 'silent' notifications (or 'push to sync') on both Android *and* iOS - a pretty crucial part of push messaging IMO. Don't forget that as well as enabling push notifications in the 'capabilities' of your iOS app in Xcode, you also have to enable remote notifications *and* background fetch within 'background modes' of your app's 'capabilities' if you want to use 'push to sync' style silent notifications.
My advice is to read the documentation very carefully and thoroughly for 'phonegap-plugin-push'. Then read it again. You will have to build your own 'FCM App server' (easy enough with Node / Express) to interact with the FCM server (firebase.google.com/docs/cloud-messaging/server) for sending messages. I also found 'Postman' (www.getpostman.com/) invaluable, too, whilst developing my FCM App server. But let's face it, it's invaluable anyway ;-)
Finally. You will learn that you have to write everything on your FCM App server twice. Once for Android and again for iOS. This is down to the way FCM rewrites your notifications before relaying them through APNS for delivery to iOS. It's annoying, but simple enough to deal with on your FCM App server.
Ultimately though, when you tie it all together, you end up with the ability to use topics (an incredibly useful feature) and you can even do scheduling etc. via your own FCP App server if required. As well as the ability to push those 'silent' messages, of course.
Having said all that. If you're OK with the T&Cs of OneSignal (onesignal.com/), it may be well worth taking a look at them. Very full featured, 'free' (other than allowing them to sell your users activity), and no need to build your own FCM App server. I've not tried them out personally as for this project my client found their T&Cs unacceptable (do read those!) but their documentation does make mention of 'silent' notifications and you could save yourself a few headaches if you're OK with their T&Cs.
I've created my app in firebase but when I run my apache cordova app on simulator I dont get any token.
You must understand what the code does in order to diagnose your issue. The reason is, your Unique Device Token is only found on mobile devices, NOT your browser. If you copied his code, it should still work on your phone and fail to work on a computer.
what font do you use in vs code?
Hello Paul, when are you going to do a video on Push Notifications with Firebase Cloud Messaging and Cordova FCM on IOS and could you posibly look into Push notification using ion cloud
Wow Very Great Tutorial and with clear Explataion!
Sir can you make IOs version for this?
Can you help me with this one sir?
My purpose of push notification is that when admin posts something user will see the notification.
Is there any problem with receiving the notification maybe the user will receive the notification everytime he opens the app.
I was planning that I will put seen and users id in the posts. If user seen the posts then user will not receive the notification anymore.
Do you know how to do this with ionic V1?
I can trust in this plugin to apps in production mode ?
Firebase is a very trustworthy service. Their plans extend out to corporate needs. To sum it up: Billions of requests per day on this service shouldnt be an issue.
this work in ionic v1?
which theme you use for visual studio code?
Dark Theme
cool terninal, how you get it
Followed the steps but get an "Error: exec proxy not found for :: FCMPlugin :: ready" error. I don't understand why the plugin doesn't compile - on Windows 10.
I have same error and also on window 10, not sure if it window 10 or something i miss.
(if I remember right) I fixed this by running on the device, not on Chrome or any other emulator.
Try checking if the platform is ready before running the code via the Cordova Platform plugin
how to make video stream functionality in my application.
can you help me how to make???
Hi Vishal,
I offer code reviews and bespoke assistance on Patreon: www.patreon.com/PaulHalliday
Paul
how to get all token on Firebase Cloud Messages???
we need a video about how to get/post data with firebase/ionic . thank you
There's some content with Firebase up on early access Patreon, with more to come soon! :)
how to create notification channel id using ionic
it doesn't work from background...... any suggestion plz
May you show us on iOS platform ? We really need that !
it does register my device but the device wont recieve the notification
its broke, build getting fail. Please update tutorial for cloud push notification
Hi Paul,
Only changing the build number didn't do the trick for me, I'm constantly getting errors saying the the google services plugin could not be detected, and that I should enter "apply plugin: 'com.google.gms.google-services'" at the end of the file. Doing this only brings me to another problem, where 'com.google.gms.google-services was not found'.
Any idea how to get out of this roadblock?
Hi Evert,
After making the changes within the Gradle file, can you try removing the platform and re-adding?
I've ran your tutorial in a completely blank project, and it doesn't seem to complain now. Could this be an issue with an older project that was still initialized in Ionic 2?
That's a hard one to say. I can't confirm/deny that, but I'll be uploading other Push implementations with things like the PushPlugin, Ionic Native FCM (same underlying plugin as this one though), OneSignal, and so on, soon.
You may find better compatibility with the above.
Thanks for the quick replies anyway, great tutorial! Complete and to the point.
thanks i'm Subscribe to your udemy cours its Will ne nice If you Can add a social authentification with Ionic and firebase.
Nice tutorial. I keep getting errors of all diff kinds. Could you please share your ionic info ? Thanks
Your system information:
Cordova CLI: 6.4.0
Ionic Framework Version: 3.2.1
Ionic CLI Version: 3.0.0-beta7
ios-deploy version: 1.9.0
ios-sim version: 5.0.11
OS: macOS Sierra
Node Version: v7.9.0
Xcode version: Xcode 8.3.2 Build version 8E2002
hi Paul
I can't find declarations.d.ts !
i don't have too
hi Paul, when i followed ur steps, i can't find the declarations.d.ts file in my src/ folder. Please help.. =S
Me neither
No worries then. Just add this to your component.
adding it inside component not working. FCMPlugin not defined error on console.
me the same!!!
thank you plz do ios too
+Achraf Sabar Certainly am! :)
Hi, what about ios ? :)
How come it worked if you didn't initialize firebase app module? I tryed it and got excption: java.lang.IllegalStateException: Default FirebaseApp is not initialized in this process br.com.fatguys.fcm. Make sure to call FirebaseApp.initializeApp(Context) first.
Sir, love your tutorials but why this is only 360p quality???
Hi,
This video has just been uploaded, RUclips has to encode it. If you check back in ~10 minutes it should be rendered in 4K.
Paul
Ok, Thank You SIR
Nice video once again!
Say, what is your reason to use "cordova-plugin-fcm" instead of like PhoneGap-Push (github.com/phonegap/phonegap-plugin-push)?
- Danny
+botnetz I'll be covering a variety of Push content, and this is just one of many implementations. :)
its not working followed
No, you're not working
newer version ionic looks different for refer latest document
guys please refer this doc
ionicframework.com/docs/native/fcm/
ios please..!!
The beauty of Cordova: It works on one platform, it works on the others.
Not working. Wasting time 💯