Develop Reference

OneSignal in Ionic V1 with Android SDK 31+

I'm having problems with my old application built on Ionic V1. From now on we need to use SDK 31 or higher on Android. I made the adjustments in my application but I am not able to make OneSignal work.
Plugin installed: onesignal-cordova-plugin 2.11.3
My app.js:
`
$ionicPlatform.ready(function() {
var notificationOpenedCallback = function(jsonData) {
var data = jsonData.notification.payload.additionalData;
if (data && data.targetUrl) {
if (data.paramsValue) {
$state.go(data.targetUrl, { paramID : data.paramsValue } );
}else{
$state.go(data.targetUrl);
}
}
//alert("Notification opened:\n" + JSON.stringify(jsonData));
console.log('notificationOpenedCallback: ' + JSON.stringify(jsonData));
};
// TODO: Update with your OneSignal AppId before running.
window.plugins.OneSignal
.startInit("MY_ID_ONESIGNAL")
.handleNotificationOpened(notificationOpenedCallback)
.endInit();
window.plugins.OneSignal.getIds(function(ids) {
$localStorage.pushToken = ids.userId;
$rootScope.pushToken = ids.userId;
//alert("player id: " + ids.userId);
});
window.plugins.OneSignal.getPermissionSubscriptionState(function(status) {
idapp = status.subscriptionStatus.userId;
});
`
I tried to update the OneSignal cordova plugin to the latest version but it still doesn't work, it's likely that the app.js needs to be changed.

Ionic 5 Firebase notification - this.fcm.onNotification().subscribe() never fired

I'm trying to add notification with firebase in my ionic application (ionic 5). I follow this tutorial : https://www.positronx.io/ionic-firebase-fcm-push-notification-tutorial-with-example/
I recieve the token and when i send a notification from firebase console, the notification is displayed on the phone (emulator) but nothing is displayed in the console to handle the notification click...
I add FCM into provides in app.modules.ts and i have added the following code in the app.component.ts
import { FCM } from "#ionic-native/fcm/ngx";
...
constructor(
...
private fcm: FCM
) {}
initializeApp() {
this.platform.ready().then(() => {
this.statusBar.styleDefault();
this.splashScreen.hide();
this.fcm.getToken().then(token => {
console.log(token);
});
this.fcm.onTokenRefresh().subscribe(token => {
console.log(token);
});
this.fcm.onNotification().subscribe(data => {
console.log(data);
if (data.wasTapped) {
console.log('Received in background');
} else {
console.log('Received in foreground');
}
});
if (token === null) {
this.msgService.presentToast(
"Impossible de configurer la reception des notifications"
);
}
// Observer.hasTokenFCM.next(token);
if (this.platform.is("ios") || this.platform.is("android")) {
// this.saveToken(token);
}
});
And a have installed the following plugins:
ionic cordova plugin add cordova-plugin-fcm-with-dependecy-updated
npm install #ionic-native/fcm
cordova plugin list:
cordova-plugin-fcm-with-dependecy-updated 4.4.0 "Cordova FCM Push Plugin"
In my package.json:
dependencies:
"#ionic-native/fcm": "^5.22.0",
"cordova-plugin-fcm-with-dependecy-updated": "^4.1.1",
"cordova" -> "plugins":
"cordova-plugin-fcm-with-dependecy-updated": {
"FCM_CORE_VERSION": "16.0.8",
"FCM_VERSION": "18.0.0",
"GRADLE_TOOLS_VERSION": "2.3.+",
"GOOGLE_SERVICES_VERSION": "3.0.0"
},
Thanks a lot if you found why the "this.fcm.onNotification.subscribe" is never fired...

To fix this, use cordova-plugin-fcm-with-dependecy-updated plugin instead of #ionic-native/fcm/ngx, they are conflicting with each other. If onNotification method is not fired and you can't get the payload, try to use getInitialPushPayload
...
const pushPayload = await this.fcm.getInitialPushPayload();
if (pushPayload) {
this.processPayload(pushPayload);
}
this.fcm.onNotification().subscribe(
(payload: PushNotification) => this.processPayload(payload)
);
...

apparently i need to use
this.firebase.onMessageReceived().subscribe(notification => {
if (notification["tap"]) {
...
}
....
});
with firebase plugin to handle notification... but i don't know why.

Error handling on react-native-fcm

I'm integrating FCM on my react-native application using https://github.com/evollu/react-native-fcm.
The notification works but I got this error every time.
console.error: "Notification handler err", {"line":67974,"column":14,"sourceURL":"http://localhost:8081/index.android.bundle?platform=android&dev=true&hot=false&minify=false"}
Environment:
react-native-cli: 2.0.1
react-native: 0.40.0
react-native-fcm: 6.1.0
I'm testing on Android ver 6.0.1 and the app is running in foreground.

I removed old code Firebase initialisation code on index.js, and it caused the error.
firebase.initializeApp({
apiKey: "",
authDomain: "",
databaseURL: "",
storageBucket: ""
});
I removed it and it's working now.

For react-native fcm. See object aps.alert
FCM.on("FCMNotificationReceived", (notification) => {
if (Platform.OS === 'ios') {
if (notification && notification.aps) {
const localNotification = {
title: notification.aps.alert.title,
body: notification.aps.alert.body,
show_in_foreground: true,
}
FCM.presentLocalNotification(localNotification);
}
}
});
FCM.on("FCMNotificationReceived", (notification) => {
// Also trigged when FCM.presentLocalNotification() and callback a notification without **aps** object;
// So the app crash, error
// Just check if (notification && notification.aps) and make localNotification object like above code
})

Ionic 2 push payload - How to use payload in component

I'm sending a push notification with Firebase and it works. When I send a payload with the push notification how is possible to read the data from the payload in the component.
When I alert the msg object from the observable it alerts [object, Object]
const cloudSettings: CloudSettings = {
'core': {
'app_id': 'fec59dd8'
},
'push': {
'sender_id': '808269516661',
'pluginConfig': {
'ios': {
'badge': true,
'sound': true
},
'android': {
'iconColor': '#343434',
'senderID': '808269516661'
}
}
}
};
Here is the code that subscribes to the push notification
this.push.rx.notification()
.subscribe((msg) => {
alert(msg.title + ': ' + msg.text);
if (msg.app.asleep || msg.app.closed) {
// The app is being opened from a notification
alert("OPEN APP");
alert(msg);
this.rootPage = RetailPage;
} else {
// The app was already open when the notification was received
alert("APP WAS OPEN");
}
});
}
Your system information:
ordova CLI: 6.3.1
Ionic Framework Version: 2.0.0-rc.3
Ionic CLI Version: 2.1.12
Ionic App Lib Version: 2.1.7
Ionic App Scripts Version: 0.0.46
ios-deploy version: Not installed
ios-sim version: Not installed
OS: Windows 10
Node Version: v6.7.0
Xcode version: Not installed
Any help appreciated
Best regards

ngCordova write file on Android

I'm trying to write file to local storage on Android device, using ngCordova function found on ionic forum. This is how the function looks:
$scope.exportClicked = function(options) {
var deferred = $q.defer();
$window.resolveLocalFileSystemURL($window.cordova.file.dataDirectory,
function(dir) {
dir.getFile('text.txt', {
create: true
}, function(fileEntry) {
fileEntry.createWriter(
function(fileWriter) {
if (options['append'] === true) {
fileWriter.seek(fileWriter.length);
}
fileWriter.onwriteend = function(evt) {
evt.fileEntry = fileEntry;
deferred.resolve(evt);
};
fileWriter.write(data);
},
function(error) {
deferred.reject(error);
}
);
}, function(er) {
deferred.reject(error);
});
});
return deferred.promise;
};
When I'm running app through ionic in webbrowser, it gives me an error:
TypeError: Cannot read property 'file' of undefined
at Scope.$scope.exportClicked (app.js:27)
I've installed cordova file plugin, but it looks like it can't find cordova.file functionality.
On Android device it won't work either. Any ideas?

You forgot to install file cordova plugin. https://github.com/apache/cordova-plugin-file

$window.cordova isn't defined. Since you are using ngCordova, and ngCordova has official support for the file plugin, I would start with the ngCordova documentation for the file plugin. Here is the bit you might be interested in:
$cordovaFile.writeFile(cordova.file.dataDirectory, "file.txt", "text", true)
.then(function (success) {
// success
}, function (error) {
// error
});
You also get the added bonus have having more readable code when you use the ngCordova implementation.
If you would rather follow your original example more closely, try replacing $window.cordova with window.cordova, or simply cordova.