I am making a chat application in Ionic 2. I want notifications to appear even when app is in foreground. I have tried using Phonegap Plugin Push and FCM Plugin both and I'm getting notifications when app is in background and when app is killed.
But these plugins didn't show notifications when app is in foreground. So I used Local Notifications Plugin by Katzer. It works for Android perfectly but in IOS I'm facing multiple issues.
When used with Phonegap Plugin Push, the local notification does appear but its click event does not work. Also, the two plugins seem to have some conflicts so when used together, sometimes normal push notifications does not arrive or their click events does not work.
When used with FCM plugin, no local notification arrived.
I also tried using phonegap-plugin-local-notification but again it worked for Android but in IOS, notification arrives in form of alert and also its click event gets called automatically.
I am stuck on this for a long time. Can someone please provide a solution? All I want is to get notification in the notification center when app is in foreground in IOS and also a click event so I can do redirection on click.
Any help would be appreciated.
I was implementing in my cordova app this plugin.
And when device ready I fired this code:
pushNotification.register(
function (result) {
//Do some stuff
}, function (error) {
//Do some stuff on error
}, {
"badge":"true",
"sound":"true",
"alert":"true",
"ecb": "onNotificationAPN"
});
And also implemented below function:
function onNotificationAPN(event) {
if (event) {
if ( event.alert ) {
alert(Recieved alert: + event.alert);
}
if ( event.sound ) {
var snd = new Media(event.sound);
snd.play();
}
if ( event.badge ) {
pushNotification.setApplicationIconBadgeNumber(function() {
//SetApplicationIconBadgeNumber success.
}, function() {
//SetApplicationIconBadgeNumber error.
},
event.badge);
}
}
}
And I am able to receive notifications also in foreground.
Related
We're using this guide to create a pretty routine push notification system.
We have everything working and push notifications are coming through. On Android, the push notifications make the default alert sound. On iOS however, no sound is made.
How can we configure the push notification to use the default alert sound on iOS (we don't want to create/manage a custom alert sound).
I've already configured the presentationOptions setting in the capacitor.config.json file.
{
"appId": "REDACTED",
"appName": "REDACTED",
"bundledWebRuntime": false,
"npmClient": "npm",
"webDir": "www",
"plugins": {
"PushNotifications": {
"presentationOptions": ["badge", "sound", "alert"]
}
}
}
Push notifications appearance in foreground
On iOS you can configure the way the push notifications are displayed when the app is in foreground by providing the presentationOptions in your capacitor.config.json as an Array of Strings you can combine.
Possible values are:
badge: badge count on the app icon is updated (default value)
sound: the device will ring/vibrate when the push notification is received
alert: the push notification is displayed in a native dialog
An empty Array can be provided if none of the previous options are desired. pushNotificationReceived event will still be fired with the push notification information.
"plugins": {
"PushNotifications": {
"presentationOptions": ["badge", "sound", "alert"]
}
}
push-notifications-appearance-in-foreground
What are you using to send the push notification?
I followed the same capacitor guide and faced the same issue, then I did a test by sending the notification from the Firebase Cloud Messaging console and it worked on iOS (the notification made a sound).
I found later that in the code I was using to send the notification (the firebase nodejs admin SDK), I didn't provide a value for the sound attribute. I assumed that since it's not required and it worked on Android, it should also work on iOS. I was wrong!
import * as admin from 'firebase-admin';
const message: admin.messaging.MessagingPayload = {
data: {
...
},
notification: {
title: 'title',
body: 'body',
sound: 'default' // Add this line
},
};
await admin.messaging().sendToDevice(tokens, message);
The docs says that this attribute is only for the Android platform, which is why I didn't set it at first.
PS: I also added the presentationOptions setting mentioned above in the capacitor.config.json file.
I am developing a cross-platform application, which requires the use of Push Notifications for both Android and iOS. I am currently using the latest Cordova plugin I've discovered for firebase-cloud messaging: https://www.npmjs.com/package/cordova-plugin-fcm-with-dependecy-updated, which works flawlessly for Android but does not improve my situation with iOS.
I've also done the following:
Check Xcode console if the connection to FCM is successful
Check if subscription to the desired topic is successful
Added com.google.fcm to Url Types in Xcode
Readded both Push Notifications and Background Mode (Remote Notifications) in Capabilities in XCode
I have the following code to set up Push Notifications, which works for Android:
this.fcm.subscribeToTopic(`my-desired-topic`);
this.fcm.onNotification().subscribe(msg => {
if (this.platform.is("ios")) {
this.showAlert(msg.aps.title, msg.aps.alert, [
"/notifications",
id
]);
console.log(msg.aps);
} else {
this.showAlert(msg.title, msg.body, ["/notifications", this.eventId]);
console.log(msg);
}
if (msg.wasTapped) {
this.router.navigate(["/notifications", id]);
console.log("Received in background");
} else {
// this.router.navigate(["/notifications", id]);
console.log("Received in foreground");
}
});
I have the following in my constructor in my Ionic 2 app but when I send a notification to the device nothing is triggered. I've tried with the app closed, and backgrounded. The iOS notification appears but on opening the app I don't see the alert that I'm expecting. What could I be doing wrong here?
this.push.rx.notification().subscribe(
() => {
alert('Received notification');
}
);
I am creating a hybrid app in ionic and want to show a notification when the app is in foreground. Based on research, the best way to do that is via cordova local notifications but though it works perfectly in Android and shows a banner with sound.
On ios, it only puts the notification in the notification try and doesnt make any sound. Can anyone help me out with this?
Here is my code
cordova.plugins.notification.local.registerPermission(function (granted) {
console.log('Permission has been granted: ' + granted);
cordova.plugins.notification.local.schedule({
text: data._raw.message,
at: alarmTime,
data: data._raw.additionalData.loan_id
});
});
You have to listen for the event when the notification is received. From your code you only schedule a notification to be sent but you do not handle receiving the notification.
This is how you register the event when the notification triggers:
$rootScope.$on('$cordovaLocalNotification:trigger',
function (event, notification, state) {
// Add some logic here:
console.log("received: ", notification);
});
Check the ngCordova docs for more events and information.
Intro
I'm using Phonegap 4.2 (based on Cordova 5.0) to create a cross-platform app.
For iOS I'm using Xcode 6.0 and I'm using the PushPlugin Cordova plugin to handle Push Notifications.
My Problem
I am able to receive push notifications within the app in the iOS version, but when the app is running in the background then I do not receive any push notifications and they do not appear in the status bar nor in the lock screen. By background I mean when the app is closed.
Details
Referencing
I include the PushPlugin plugin in the config.xml properly:
<feature name="PushPlugin">
<param name="android-package" value="com.plugin.gcm.PushPlugin" />
<param name="ios-package" value="PushPlugin" />
</feature>
I'm referencing the PushPlugin JavaScript object properly in the index.html file:
<script type="text/javascript" src="./js/PushNotification.js"></script>
Attaching the push-notification event
I have properly attached the notification event to the method onNotificationAPN:
pushNotification = window.plugins.pushNotification;
if (device.platform == 'android' || device.platform == 'Android' || device.platform == 'amazon-fireos')
{
// ...
}
else
{
pushNotification.register(tokenHandler, errorHandler,
{
"badge":"true",
"sound":"true",
"alert":"true",
"ecb":"onNotificationAPN"
});
}
tokenHandler and errorHandler are defined and so is onNotificationAPN;
function onNotificationAPN(e)
{
// handle APNS notifications for iOS
if (e.alert)
{
// showing an alert also requires the org.apache.cordova.dialogs plugin
// Note that I have org.apache.cordova.dialogs aswell
navigator.notification.alert(e.alert);
// This code snippet runs fine when the app is open: the app receives the push notification and it's alerted to the user.
}
if (e.sound)
{
// playing a sound also requires the org.apache.cordova.media plugin
// Note that I have org.apache.cordova.media plugin aswell
var snd = new Media(e.sound);
snd.play();
}
if (e.badge)
{
pushNotification.setApplicationIconBadgeNumber(successHandler, e.badge);
// This code snippet works fine when the app is open: the app receives a push notification and when I close the app the badge count is set to 1, whether that's an expected behavior or not I'm not sure but not what matters right now.
}
}
As said, the app does receive and alerts notifications pushed to it when the app is open.
The device does not seem to notice the push, however, when the app is not open. I'd expect the push notification to appear in the lock screen and or in the status bar.
The testing device
I'm testing on an iPad which's OS version is 7.0.3.
Provisioning profile
I'm using a development provisioning profile and the device I'm using for testing has been added to the App's devices in the apple development center.
The push-notification's payload
The payload that's being sent in the Push Notifications looks like this:
Msg: {
"sound":"beeb.wav",
"alert":"Here is a testing push notification",
"badge":"1",
"location":"", // Custom variable
foreground:"1"
}
I've tried changing the foreground variable to 0 and replace foreground with background but it doesn't really change anything.
Notification Center
I have configurated the notification center for the app as it should be:
Badge App Icon is ON.
Sounds is ON.
Show in Notification Center is ON.
Include is set to 5 Recent Items.
Show on Lock Screen is ON.
Help?
I've been looking around a lot but I'm sort of blank, I'd appreciate if Stack-overflow can help. I usually stick to answering questions but now it's my turn to ask :)
The push notification payload need an aps key, and an alert with the message that will be displayed:
For each notification, compose a JSON dictionary object (as defined by
RFC 4627). This dictionary must contain another dictionary identified
by the key aps. The aps dictionary can contain one or more properties
that specify the following user notification types
An alert message to display to the user
A number to badge the app icon with
A sound to play
More info
Payload example:
{
"aps" : {
"alert" : "You got your emails.",
"badge" : 9,
"sound" : "bingbong.aiff"
},
"acme1" : "bar",
"acme2" : 42
}
When the app is in foreground you receive the whole payload and you can handle it even if it doesn't have that format, but when the app is in backgroud or closed, the system needs the aps key and the alert with the message that will be shown on the notification center.