React-native-firebase: firebase.notifications().onNotification does not work well

[pengcao1]

Issue

1 Android Native side can receive the Notification, like below log snippent

03-06 13:09:57.833 18045 18243 D RNFMessagingService: onMessageReceived event received
03-06 13:09:57.834 18045 18045 D RNFirebaseNotifications: Received new remote notification

2 register Notification listener in App.js componentDidMount like this

   componentDidMount() {
    this.createNotificationListeners();
  }
  createNotificationListeners() {
  // sometime this callback invoke radom..
    firebase.notifications().onNotification((notification) => {// <-- this line cann't be invoke
    console.log("notification receive.."); 
      const { title, body } = notification;
      this.showNotification(title, body);
    });
}

---

Project Files

• Android: android/app/build.gradle contents.

    implementation "com.google.firebase:firebase-core:16.0.7"
    implementation "com.google.firebase:firebase-analytics:16.3.0"
    implementation "com.google.firebase:firebase-messaging:17.3.4"
    implementation "com.crashlytics.sdk.android:crashlytics:2.9.3"

iOS

ios/Podfile:

• [ ] I'm not using Pods
• [x] I'm using Pods and my Podfile looks like:

# N/A

AppDelegate.m:

// N/A

---

Android

android/build.gradle:

// N/A

android/app/build.gradle:

    implementation "com.google.firebase:firebase-core:16.0.7"
    implementation "com.google.firebase:firebase-analytics:16.3.0"
    implementation "com.google.firebase:firebase-messaging:17.3.4"
    implementation "com.crashlytics.sdk.android:crashlytics:2.9.3"

android/settings.gradle:

// N/A

MainApplication.java:

new RNFirebaseNotificationsPackage(),
new RNFirebaseMessagingPackage()

AndroidManifest.xml:

<meta-data
            android:name="com.google.firebase.messaging.default_notification_icon"
            android:resource="@mipmap/ic_launcher" />
            <!-- Set color used with incoming notification messages. This is used when no color is set for the incoming
            notification message. See README(https://goo.gl/6BKBk7) for more. -->
          <meta-data
            android:name="com.google.firebase.messaging.default_notification_color"
            android:resource="@color/colorAccent" />
          <meta-data
            android:name="com.google.firebase.messaging.default_notification_channel_id"
            android:value="@string/default_notification_channel_id"/>
              <receiver android:name="io.invertase.firebase.notifications.RNFirebaseNotificationReceiver"/>
         <receiver android:enabled="true" android:exported="true"  android:name="io.invertase.firebase.notifications.RNFirebaseNotificationsRebootReceiver">
                <intent-filter>
                <action android:name="android.intent.action.BOOT_COMPLETED"/>
                <action android:name="android.intent.action.QUICKBOOT_POWERON"/>
                <action android:name="com.htc.intent.action.QUICKBOOT_POWERON"/>
                <category android:name="android.intent.category.DEFAULT" />
                </intent-filter>
        </receiver>
        <service android:name="io.invertase.firebase.messaging.RNFirebaseMessagingService">
            <intent-filter>
                <action android:name="com.google.firebase.MESSAGING_EVENT" />
            </intent-filter>
         </service>
        <service android:name="io.invertase.firebase.messaging.RNFirebaseInstanceIdService">
            <intent-filter>
                <action android:name="com.google.firebase.INSTANCE_ID_EVENT"/>
            </intent-filter>
        </service>
        <service android:name="io.invertase.firebase.messaging.RNFirebaseBackgroundMessagingService" />

---

Environment

• Platform that you're experiencing the issue on:
  
  
  
  • [x] iOS
  
  
  • [x] Android
  
  
  • [x] Both
  
  
• If known, the version of the platform are you experiencing the issue on:
  
  
  
  • iOS 10
  
  
  • Android API 28
  
  
• Operating System:
  
  
  
  • [x] MacOS, version: 10.14.2
  
  
• Build Tools:
  
  
  
  • Xcode 10
  
  
  • Android Studio 3.2
  
  
• *React Native version:0.55.2*
  
  
  
  • react: 16.3.1
  
  
• *React Native Firebase library version:4.3.8*
• Firebase module(s) you're using that has the issue:
  
  
  
  • [ ] N/A
  
  
  • [ ] Authentication
  
  
  • [x] Analytics
  
  
  • [ ] Cloud Firestore
  
  
  • [x] Cloud Messaging (FCM)
  
  
  • [ ] Crashlytics
  
  
  • [ ] Dynamic Links
  
  
  • [ ] Functions Callable
  
  
  • [ ] In App Messaging
  
  
  • [ ] Indexing
  
  
  • [ ] Invites
  
  
  • [ ] Instance ID
  
  
  • [ ] ML Kit
  
  
  • [x] Notifications
  
  
  • [ ] Performance Monitoring
  
  
  • [ ] Realtime Database
  
  
  • [ ] Remote Config
  
  
  • [ ] Storage
  
  
• Are you using TypeScript?
  
  
  
  • [ ] No
  
  
  • [x] Yes, version: 2.1
  
  
• Are you using Expo, e.g. ExpoKit?
  
  
  
  • [x] No
  
  
  • [ ] Yes, I've _not_ ejected
  
  
  • [ ] Yes, but I have ejected to ExpoKit
  
  
  • [ ] Yes, but I have ejected to vanilla React Native
  
  
  • Expo version: N/A
  
  

---

Think react-native-firebase is great? Please consider supporting the project with any of the below:

• 👉 Donate via Open Collective
• 👉 Follow React Native Firebase and Invertase on Twitter
• 👉 Star this repo on GitHub ⭐️
• 👉 Contribute; see our contributing guide

[viniciusoliveira01]

I'm having the same problems here.
On android I receive the notification by the method onNotification and on IOS by the method onMessage

[fabiodamasceno]

Two days ago I had the same problem and resolve changing google firebase messaging package in ./android/build/app.gradle folder to older version:

implementation "com.google.firebase:firebase-messaging:17.3.1"

instead of:

implementation "com.google.firebase:firebase-messaging:17.3.4"

My react-native-firebase package version is 5.2.3 and react-native is 0.57.8.

@Salakar what do you think to update documentation since it does not work with this latest messaging package version?

[rarenatoe]

I tried this changing of version but didn't work.

[fabiodamasceno]

What error is hapenning for you, @renato-bvdash?

[rarenatoe]

firebase.notifications().onNotification not getting invoked ever.

[fabiodamasceno]

Can you bring more details? React Native version, firebase and code? Be sure you are calling has permission 'cause this method is required to onNotification works correctly. Besides that keep in mind onNotification and onMessage works can be called in diferentes moments, being the first one only (iOS) called when APN certificates is configured in Apple Developer panel.

[rarenatoe]

Ah, I didn't know that. I've been testing on android this entire time. In any case, here is my information:

"react-native": "0.57.4",
"react-native-firebase": "^5.2.3"

I call this on the render method of App.js

class RegisterDevice extends Component {
    componentDidMount() {  
        const messaging = firebase.messaging();

        messaging.hasPermission()
        .then((enabled) => {
            if (enabled) {
                messaging.getToken()
                    .then(fcmToken => {this.props.addDevice(fcmToken)})
                    .catch(error => { /* handle error */ });
            } else {
                messaging.requestPermission()
                    .then(() => { /* got permission */ })
                    .catch(error => { /* handle error */ });
            }
        })
        .catch(error => { /* handle error */ });

        messaging.onMessage((message: RemoteMessage) => {
        });

        firebase.notifications().onNotification((notification) => {
            const { title, body } = notification;

            PushNotification.localNotification({
                title: title,
                message: body, // (required)
            });
        });

    render() {
        return null;
    }
}

[asilvestre87]

I have the same issue in:
"react-native": "0.59.4",
"react-native-firebase": "^5.3.1"

But i implements Navigation, and since then it not works

[keech]

Any updates?

[mikehardy]

For errors like these, it would be helpful to include the exact test scenario.
It is my understanding that onNotification() is only triggered when a user taps a local notification while the app is in the foreground.

local notification in the background -> onNotificationOpened
local notification while stopped -> app starts and getInitialNotification has info
remote notifications -> A whole different matrix of foreground/background/suspended/killed + ios vs android + data-only vs has notification content vs has content-available+background-fetch stuff.

I have been implementing this the last few days and it is not so simple at all, but it all seems to work for me so far, as documented.

[zashishz]

This worked for me:
Make sure you have updated your AndroidManifest.xml with changes provided here:
https://rnfirebase.io/docs/v4.2.x/messaging/android

[Kevinpahlevi]

@viniciusoliveira01 did u fix your problem? same issue here

[mikehardy]

If anyone has combined react-native-splash-screen with react-native-firebase, and they implemented the splash screen with a separate launch activity, this will happen. There are workarounds but you should use splash-screen with a single Activity and it just works. Code here: https://github.com/crazycodeboy/react-native-splash-screen/issues/289#issuecomment-502406454

[mikehardy]

can no longer reproduce in my app, it's working

[hopewise]

@mikehardy you mentioned react-native-splash-screen, but the issue is about notification listener, is there any relation?

[mikehardy]

@hopewise see my linked comment above, there's code in it that shows the problem I think

[DevPolo]

remote notifications -> A whole different matrix of foreground/background/suspended/killed + ios vs android + data-only vs has notification content vs has content-available+background-fetch stuff.

@mikehardy I'm confused about the remote notification logic and I'm stuck for many days and could not figure out how to receive remote notification on IOS. Please, have you got a good article or documentation to share ?

I'm using
"react-native-firebase": "^5.6.0"

[luis-furtado]

Verify if your xCode is selected backgroundModes permissions like that

This is new fields of xcode 11 and you have to check that