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
})
Related
I am implementing expo-notifications into my react native app. Notifications have been working fine up until a couple weeks ago and I can't figure out what the issue is.
Everything on Android is working properly, but on iOS I'm not able to receive notifications. I've checked and I have notifications allowed in my settings and am receiving a "valid" ExpoPushToken because I was able to put that push token into their testing tool without error. I also tested it myself on postman using their api and received a status of "ok", but still didn't see a notification on my phone.
Here's my code for getting the token:
async function registerForPushNotificationsAsync() {
let token;
if (Device.isDevice) {
const { status: existingStatus } =
await Notifications.getPermissionsAsync();
let finalStatus = existingStatus;
if (existingStatus !== "granted") {
const { status } = await Notifications.requestPermissionsAsync({
ios: {
allowAlert: true,
allowBadge: true,
allowSound: true,
},
});
finalStatus = status;
}
if (finalStatus !== "granted") {
// alert("Failed to get push token for push notification!");
return;
}
token = (
await Notifications.getExpoPushTokenAsync({
experienceId: "#username/app-slug",
})
).data;
console.log(token);
}
if (Platform.OS === "android") {
Notifications.setNotificationChannelAsync("default", {
name: "default",
importance: Notifications.AndroidImportance.MAX,
vibrationPattern: [0, 250, 250, 250],
lightColor: "#FF231F7C",
});
}
return token;
}
Obviously #username and app-slug are my username and slug for my expo project.
The only thing that I know has changed is I've upgraded to Expo SDK 46 and I added in the experienceId into the getExpoPushTokenAsync function. Could adding experienceId screw up receiving notifications? Or is there something obvious that I'm missing here?
I figured out my issue. I had multiple Push Keys that were set up in my Apple Developer account. I revoked both and had expo generate a new one using eas credentials and that fixed my issue.
I have an Ionic 5 app with Capacitor 3 and I'm trying to receive notifications using Firebase Cloud messaging, on an Android device. I followed the configurations,(I downloaded the google JSON file and put my app id name correctly ) and I'm getting correctly the device token. Once my app is open I get the token successfully without any error and then I send a notification sharing my token to the Firebase test message, the notification never arrived, and also I never get an error of push notification in my logger. This is the code that I use for push notification.
export class PushNotificationsService {
constructor(private readonly http: HttpClient, private notificationState: NotificationsStore) { }
public initPush() {
if (Capacitor.getPlatform() !== 'web') {
this.registerPush();
}
}
private registerPush() {
PushNotifications.requestPermissions().then(async result => {
if (result.receive === 'granted') {
// Register with Apple / Google to receive push via APNS/FCM
console.log('granted');
await PushNotifications.register();
} else {
// Show some error
console.log('errorr');
}
});
// On success, we should be able to receive notifications
PushNotifications.addListener('registration',
(token: Token) => { (I get through this step and access the token successfully)
console.log('Push registration success, token: ' + token.value);
this.notification state.setToken(token.value);
}
);
// I never get this step error
PushNotifications.addListener('registrationError',
(error: any) => {
console.log('Error on registration: ' + JSON.stringify(error));
}
);
PushNotifications.addListener('pushNotificationReceived',
(notification: PushNotificationSchema) => {
console.log('Push received: ' + JSON.stringify(notification));
}
);
PushNotifications.addListener('pushNotificationActionPerformed',
(notification: ActionPerformed) => {
console.log('Push action performed: ' + JSON.stringify(notification));
}
);
}
I also have capacitor.config.json like this:
"PushNotifications": {
"presentationOptions": ["badge", "sound", "alert"]
}
Also, I checked that my device and app have permission for notifications and are enabled both. I tried and test this issue with my app open and closed and open only in the background and the notification never arrives. What it could be? Any clue? Thank you
Android Phone Please Create the channel Like this, Test or Add screenshot for console Error
if (Capacitor.getPlatform() === 'android') {
PushNotifications.createChannel({
id: 'fcm_default_channel',
name: 'app name',
description: 'Show the notification if the app is open on your device',
importance: 5,
visibility: 1,
lights: true,
vibration: true,
});
}
The expo push notifications through Firebase configuration was working well for last 1.5 months until 2 days ago, the production build stopped receiving any notifications. On further analysis of this issue, I found that the exponent push token was not being generated by the getExpoPushTokenAsync() method for android platform alone. IOS still works fine.
I haven’t touched the code regarding notifications for the last 1.5 months. Don’t know how to fix this as it is an important feature of the app. All the FCM configurations have been done properly. The notifications and expo token generation works in development though, when using the expo go app but just not in production.
const registerForPushNotificationsAsync = async () => {
let token;
if (Device.isDevice) {
const { status: existingStatus } =
await Notification.getPermissionsAsync();
let finalStatus = existingStatus;
if (existingStatus !== "granted") {
const { status } = await Notification.requestPermissionsAsync();
finalStatus = status;
}
if (finalStatus !== "granted") {
return;
}
token = (await Notification.getExpoPushTokenAsync()).data;
}
if (Platform.OS === "android") {
Notification.setNotificationChannelAsync("default", {
name: "default",
importance: Notification.AndroidImportance.MAX,
vibrationPattern: [0, 250, 250, 250],
lightColor: "#FF231F7C",
});
}
return token; };
useEffect(() => {
// method to check JWT token validity before making API call
let tokenValidity = checkJwtValidity(
jwtToken,
setIsLoggedIn,
setjwtToken,
setUser
);
if (tokenValidity) {
registerForPushNotificationsAsync().then(async (token) => {
// on receiving of token, making an api call to send to backend so they can push the notification to the device using the token
const response = await sendDeviceNotificationToken(jwtToken, token);
console.log(response);
});
}}, []);
Just added one line on my app/build.gradle.file and it started working.
implementation 'com.google.firebase:firebase-iid:17.0.2'
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.
I'm working on my first Firebase app with Ionic and I'm having some issues with my login code. From my browser I see no issues but once I install the app on to a phone(iOS & Android) the login takes about a minute because the callback from onAuthStateChanged takes a long time. I'm using "firebase": "^3.8.0". I added the code I'm using to login. Any ideas on why Firebase is choking?
app.component.ts
constructor(public platform: Platform, private statusBar: StatusBar) {
this.rootPage = LoginPage;
let config = {
apiKey: "***",
authDomain: "***",
databaseURL: "***",
storageBucket: "***",
messagingSenderId: "***"
};
firebase.initializeApp(config);
this.authData = new AuthData();
this.zone = new NgZone({});
const subscribe = firebase.auth().onAuthStateChanged((user) => {
console.log("onAuthStateChanged");
this.zone.run(() => {
console.log(" zone onAuthStateChanged");
if (!user) {
this.rootPage = LoginPage;
subscribe();
} else {
// this.rootPage = HomePage;
this.rootPage = EditProfile;
subscribe();
}
});
});
Upgrading to firebase 3.9.0 in your project, solves the issue for sure.
I also faced with the same issue.
After some research I found that this issue comes with firebase "3.8.0".
Downgrade to 3.6.6 solved the problem for me
The update 3.8.0 slowed down the authentication on Ionic 2 devices. Here is the discussion about it in this issue and the solution by the firebase team untill they fix it google docs in the new patch.