Hello All, Can some one provide some input on how to implement push notification through ionic/phonegap.
Scenario, is just like how outlook/calendar work.
I am having a rest service when it sends some notifications. When ever this service sends message my app has to catch it (even in idle state)and should display as notification to user.
Can some one share implementation details on this? Mainly, Like how angular should listen to any messages from server…how to do notifications to user. I know i have to user phonegap notification API. BUt, I am looking more on how my app should catch data from server on Active/idle state.
Adding push notifications is a bit more complex than just a simple post. First you should check out some angular wrappers for push notifications.
If you plan to host the server yourself, then best of luck to you
But if you able to use a service, I’d suggest pushwoosh. They are simple to set up, works with cordova, and provide an in-depth guide for iOS and android.
One question though, I opened app and I placed a “Register” button in my App. On click of this button I am registering device for push notifications. After that I am push notifications from server and I am able to receive successfully. But, lets say I clicked on “Home” button of device. I navigated different app and came back to my push notification app again. (now, my app is in running state) Now, if I send message from server I am not seeing notification. But If I click on register button then I am receiving message. Is this correct approach? Every time I open app I need to register device?
If it’s taken right from the example, no, that’s just meant to show you an example of the API. A better example would be to just register the device for notifications on load, or present a popup to let them chose to show notifications ( think iOS)
When I close the app, it enters the ‘suspend’ state in iOS.
Then, when the notification appears, tapping it will load the app again, resuming the previous state prior to suspension. I need to navigate to different view when the app is loaded from a notification. How is that done? I’ve been completely stuck on this all day!
Any help is greatly appreciated, I’ll buy you a case of beer if you help me!
This is more like a notification when the app is minimized on iOS. I’m not so sure it is possible now without using push notifications. However, our client doesn’t want to support / pay for push notifications so I’m not sure how to proceed with this. Local notifications are not flexible at all.
The only problem with this implementation is my onNotificationAPN function is “outside of angular.” So $state is not present. I guess I could just do window.location(fullURL)?
Note: You can attach the onNotificationAPN function to your angular application variable - then you are inside angular and should be fine.
var app = angular.module(‘app’, [‘ionic’, ‘ngSanitize’, …
then after ionic.Platform.ready(function(){… you register for push and use
app.onNotificationAPN = function onNotificationAPN (event) { etc…
Basically where you define your onNotificationAPN function - add it to whatever variable you defined for your angular application.
mine is ‘app’ as in var app = angular.module(‘app’, [ionic…
I just have the “onNotificationGCM” function defined as a private function on the factory. In my case, the register function is passed the function that needs to be called. In your case, you might be able to put “pushNotification.onNotificationGCM” as the function name.
onNotificationGCM = function(data) {
// do something with data…
};
Hey, it depends where you’ve defined ngApp. I’d say just use root element: $rootElement.injector().
As for the function thing. This is strange. You are passing a string, so it’s probably doing an eval or something. If you can pass in a function object then you can control the calling context.
At any rate, using the injector will make it work regardless. Try in your onNotificationAPN function:
var element = document.querySelector('.ng-scope');
var $rootElement = angular.element(element).injector().get('$rootElement');