React-native-push-notification: I am getting duplicate notfication on FCM

Created on 14 Aug 2019 · 14Comments · Source: zo0r/react-native-push-notification

I am getting duplicate notification whenever i push a notification to device. It is working perfectly in APNS. Problem is only on FCM

AndroidManifest.xml

<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    package="com.nsights">

    <uses-permission android:name="android.permission.INTERNET" />
    <uses-permission android:name="android.permission.CAMERA" />
    <uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE"/>

    <uses-permission android:name="android.permission.WAKE_LOCK" />
    <permission
        android:name="${applicationId}.permission.C2D_MESSAGE"
        android:protectionLevel="signature" />
    <uses-permission android:name="${applicationId}.permission.C2D_MESSAGE" />
    <!-- < Only if you're using GCM or localNotificationSchedule() > -->

    <uses-permission android:name="android.permission.VIBRATE" />
    <uses-permission android:name="android.permission.RECEIVE_BOOT_COMPLETED"/>

    <application
      android:name=".MainApplication"
      android:label="@string/app_name"
      android:icon="@mipmap/group151"
      android:roundIcon="@mipmap/group151"
      android:allowBackup="false"
      android:theme="@style/AppTheme">
      <activity
        android:name=".MainActivity"
        android:label="@string/app_name"
        android:configChanges="keyboard|keyboardHidden|orientation|screenSize"
        android:windowSoftInputMode="adjustResize">
        <intent-filter>
            <action android:name="android.intent.action.MAIN" />
            <category android:name="android.intent.category.LAUNCHER" />
        </intent-filter>
      </activity>
      <activity android:name="com.facebook.react.devsupport.DevSettingsActivity" />

        <meta-data  android:name="com.dieam.reactnativepushnotification.notification_channel_name"
            android:value="YOUR NOTIFICATION CHANNEL NAME"/>
        <meta-data  android:name="com.dieam.reactnativepushnotification.notification_channel_description"
            android:value="YOUR NOTIFICATION CHANNEL DESCRIPTION"/>
        <!-- Change the resource name to your App's accent color - or any other color you want -->
        <meta-data  android:name="com.dieam.reactnativepushnotification.notification_color"
            android:resource="@android:color/white"/>

        <!-- < Only if you're using GCM or localNotificationSchedule() > -->
        <receiver
            android:name="com.google.android.gms.gcm.GcmReceiver"
            android:exported="true"
            android:permission="com.google.android.c2dm.permission.SEND" >
            <intent-filter>
                <action android:name="com.google.android.c2dm.intent.RECEIVE" />
                <category android:name="${applicationId}" />
            </intent-filter>
        </receiver>
        <!-- < Only if you're using GCM or localNotificationSchedule() > -->

        <receiver android:name="com.dieam.reactnativepushnotification.modules.RNPushNotificationPublisher" />
        <receiver android:name="com.dieam.reactnativepushnotification.modules.RNPushNotificationBootEventReceiver">
            <intent-filter>
                <action android:name="android.intent.action.BOOT_COMPLETED" />
            </intent-filter>
        </receiver>
        <service android:name="com.dieam.reactnativepushnotification.modules.RNPushNotificationRegistrationService"/>

        <!-- < Only if you're using GCM or localNotificationSchedule() > -->
        <service
            android:name="com.dieam.reactnativepushnotification.modules.RNPushNotificationListenerServiceGcm"
            android:exported="false" >
            <intent-filter>
                <action android:name="com.google.android.c2dm.intent.RECEIVE" />
            </intent-filter>
        </service>
        <!-- </ Only if you're using GCM or localNotificationSchedule() > -->

        <!-- < Else > -->
        <service
            android:name="com.dieam.reactnativepushnotification.modules.RNPushNotificationListenerService"
            android:exported="false" >
            <intent-filter>
                <action android:name="com.google.firebase.MESSAGING_EVENT" />
            </intent-filter>
        </service>
    </application>



</manifest>

Source

aslampr07

👍1

Most helpful comment

Had the same problem. I am using FCM with Firebase-admin sdk on nodejs.

Fixed it by adding a tag to the payload.
const payload = { notification: { title: "New notification, body: "Body", tag: "RANDOM_STRING_HERE" } };

PerlBug on 7 Jan 2020

👍5

All 14 comments

I am also facing the same issue. People suggested removing the block of code from androidmanifest.xml. It solves the duplicate notification problem at the background, but I am no longer able to receive notification foreground.

      <receiver
        android:name="com.google.android.gms.gcm.GcmReceiver"
        android:exported="true"
        android:permission="com.google.android.c2dm.permission.SEND" >
        <intent-filter>
          <action android:name="com.google.android.c2dm.intent.RECEIVE" />
          <category android:name="${applicationId}" />
        </intent-filter>
      </receiver>

I also trying to play with the .java files, but no luck solving this issue.

melvinchng on 16 Aug 2019

🎉2

Thanks @melvinchng, removing that block of code solved the issue for me. I am still receiving notifications in the foreground as well. If it helps you debug it and it case it's been fixed in a different version, I've got it working with the following versions:

react-native-firebase/app: 6.2.0
react-native-firebase/messaging: 6.2.0
react-native-push-notification: 3.1.9

yannickvidal on 19 Dec 2019

@yannickvidal can you provide the JSON object that you send to FCM server for reference?

melvinchng on 19 Dec 2019

@melvinchng I am sending the following payload for Android:

{
    "payload":{
        "data": {
            "title" :"Test",
                    "message": "Test",
                    "notId": "222222222222222",
                    "content-available": "1",
                    "style": "picture",
                    "picture": "https://www.test.com/something.png"
        }
    },
    "token":"fcm_token_goes_here"
}

yannickvidal on 19 Dec 2019

@yannickvidal Thanks! I am using notification object instead, as FCM server will generate relevant notification objects and push to APN server.

May I know what do you do with the two packages below? After installation, do you do any react-native link to setup the libraries below?

react-native-firebase/app: 6.2.0
react-native-firebase/messaging: 6.2.0

melvinchng on 19 Dec 2019

@melvinchng No problem, I am using react-native-firebase/messaging to listen to FCM. I'm using React Native 0.61.4 so I didn't need to link the libraries manually. To setup the libraries I followed the documentation at https://invertase.io/oss/react-native-firebase/ and https://invertase.io/oss/react-native-firebase/v6/messaging respectively.

yannickvidal on 19 Dec 2019

@yannickvidal I managed to upgrade my codebase from 0.58.5 to 0.61.5 as well as setting up react-native-firebase/app and react-native-firebase/messaging. However, I am still getting duplicate notifications on Android. If I removed the code stated from androidmanifest.xml, I am not able to get any push notification in the app (foreground) for Android.

I believed the reason why we are getting to different results are due to the way we setup the payload to the FCM server: notification & data; For my case, I am using notification. FCM will generate a data object for both iOS and Android when notification object is used as the payload. However, if I go with data object, iOS won't be able to receive any notification.

    "notification": {
        "title_loc_key" : "TASK_SUBMITTED",
        "body_loc_key" : "TASK_SUBMITTED_MESSAGE",
        "body_loc_args": ["[TEST] Project Agile Task 1", "[TEST] Project Agile Task 2"],
        "sound": "default",
        "color": "#2ca8a0",
        "foregound": true,
        "route": "Home"
    }

melvinchng on 23 Dec 2019

All those Only if you're using GCM or local notifications blocks of XML from the readme should not be in there if you're using FCM and aren't using local notifications. And the else parts from the readme should be in there in that case.

tolmekian1453 on 30 Dec 2019

👎1

Had the same problem. I am using FCM with Firebase-admin sdk on nodejs.

Fixed it by adding a tag to the payload.
const payload = { notification: { title: "New notification, body: "Body", tag: "RANDOM_STRING_HERE" } };

PerlBug on 7 Jan 2020

👍5

Had the same problem. I am using FCM with Firebase-admin sdk on nodejs.

Fixed it by adding a tag to the payload.
const payload = { notification: { title: "New notification, body: "Body", tag: "RANDOM_STRING_HERE" } };

Wow. finally a working solution! I wonder how you managed to find this solution.

melvinchng on 7 Jan 2020

Had the same problem. I am using FCM with Firebase-admin sdk on nodejs.
Fixed it by adding a tag to the payload.
const payload = { notification: { title: "New notification, body: "Body", tag: "RANDOM_STRING_HERE" } };

Wow. finally a working solution! I wonder how you managed to find this solution.

A lot of time spent on google :grimacing:

PerlBug on 7 Jan 2020

🎉1

Brilliant, works for me now thanks.

For anyone else coming up against it, I needed to keep the receiver in my AndroidManifest and add the tag to my notification object as detailed above

RuairiOliver on 16 Jan 2020

👍2

@melvinchng you can try this solution for Android foreground notifications: https://github.com/zo0r/react-native-push-notification/issues/1061#issuecomment-490132542
I've managed to get foreground and background notification to work by removing part you suggested and appending RNPushNotificationListenerService service for com.google.firebase.MESSAGING_EVENT action. My current Android Manifest:

<manifest xmlns:android="http://schemas.android.com/apk/res/android"
  package="com.mrcat_client_app">

  <uses-permission android:name="android.permission.INTERNET" />
  <uses-permission android:name="android.permission.WAKE_LOCK" />
  <permission android:name="${applicationId}.permission.C2D_MESSAGE"
    android:protectionLevel="signature" />
  <uses-permission android:name="${applicationId}.permission.C2D_MESSAGE" />
  <application android:name=".MainApplication"
    android:label="@string/app_name"
    android:icon="@mipmap/ic_launcher"
    android:allowBackup="false"
    android:usesCleartextTraffic="true"
    android:theme="@style/AppTheme">
    <activity android:screenOrientation="portrait"
      android:name=".MainActivity"
      android:label="@string/app_name"
      android:configChanges="keyboard|keyboardHidden|orientation|screenSize"
      android:windowSoftInputMode="adjustResize">
      <intent-filter>
        <action android:name="android.intent.action.MAIN" />
        <category android:name="android.intent.category.LAUNCHER" />
      </intent-filter>
    </activity>
    <activity android:name="com.facebook.react.devsupport.DevSettingsActivity" />
    <meta-data android:name="com.dieam.reactnativepushnotification.notification_channel_name"
      android:value="notifications"/>
    <meta-data android:name="com.dieam.reactnativepushnotification.notification_channel_description"
      android:value="general_notifications"/>
    <meta-data android:name="com.dieam.reactnativepushnotification.notification_color"
      android:resource="@android:color/white"/>
    <receiver android:name="com.dieam.reactnativepushnotification.modules.RNPushNotificationPublisher" />
    <receiver android:name="com.dieam.reactnativepushnotification.modules.RNPushNotificationBootEventReceiver">
      <intent-filter>
        <action android:name="android.intent.action.BOOT_COMPLETED" />
      </intent-filter>
    </receiver>
    <service android:name="com.dieam.reactnativepushnotification.modules.RNPushNotificationRegistrationService"/>
    <service android:name="com.dieam.reactnativepushnotification.modules.RNPushNotificationListenerServiceGcm"
      android:exported="false">
      <intent-filter>
        <action android:name="com.google.android.c2dm.intent.RECEIVE" />
      </intent-filter>
    </service>
    <service android:name="com.dieam.reactnativepushnotification.modules.RNPushNotificationListenerService"
      android:exported="false">
      <intent-filter>
        <action android:name="com.google.firebase.MESSAGING_EVENT" />
      </intent-filter>
    </service>
  </application>
</manifest>

fotonmoton on 28 Mar 2020

👍1

This issue should not occured with the latest version, you will need to check the installation process in the README.
Many settings in AndroidManifest are not required anymore.