React-native-firebase: Android background notifications, banner not showing

[mi-mazouz]

Issue

Hello I'm trying to receive background notifications on android (everything works well on IOS). I can receive notifications in foreground with the banner but in background they only appear in the notification center, any banner is displaying!

my index.js looks like:

import { AppRegistry } from "react-native";

import App from "./src/App";
import { name as appName } from "./app.json";
import bgMessaging from "./src/tools/bgMessaging";

AppRegistry.registerComponent(appName, () => App);
AppRegistry.registerHeadlessTask("RNFirebaseBackgroundMessage", () => bgMessaging);

my bgMessaging:

export default async (message) => {
  const notificationToBeDisplayed = new firebase.notifications.Notification({
    data: Test',
    sound: 'default',
    title: 'Test',
    body: 'Test'
  });

  if (Platform.OS === 'android') {
    notificationToBeDisplayed.android
      .setPriority(firebase.notifications.Android.Priority.High)
      .android.setChannelId('Default')
      .android.setVibrate(1000);
  }
  await firebase.notifications().displayNotification(notificationToBeDisplayed);
}

Project Files

Android

Click To Expand

#### `android/build.gradle`:

// Top-level build file where you can add configuration options common to all sub-projects/modules.

buildscript {
    ext {
        buildToolsVersion = "28.0.3"
        minSdkVersion = 16
        compileSdkVersion = 28
        targetSdkVersion = 28
        supportLibVersion = "28.0.0"
    }
    repositories {
        google()
        jcenter()
    }
    dependencies {
        classpath 'com.android.tools.build:gradle:3.4.1'
        classpath 'com.google.gms:google-services:4.2.0'

        // NOTE: Do not place your application dependencies here; they belong
        // in the individual module build.gradle files
    }
}

allprojects {
    repositories {
        mavenLocal()
        google()
        jcenter()
        maven {
            // All of React Native (JS, Obj-C sources, Android binaries) is installed from npm
            url "$rootDir/../node_modules/react-native/android"
        }
    }
}

#### `android/app/build.gradle`:

apply plugin: "com.android.application"

import com.android.build.OutputFile

project.ext.react = [
    entryFile: "index.js"
]

apply from: "../../node_modules/react-native/react.gradle"

/**
 * Set this to true to create two separate APKs instead of one:
 *   - An APK that only works on ARM devices
 *   - An APK that only works on x86 devices
 * The advantage is the size of the APK is reduced by about 4MB.
 * Upload all the APKs to the Play Store and people will download
 * the correct one based on the CPU architecture of their device.
 */
def enableSeparateBuildPerCPUArchitecture = false

/**
 * Run Proguard to shrink the Java bytecode in release builds.
 */
def enableProguardInReleaseBuilds = false

android {
    compileSdkVersion rootProject.ext.compileSdkVersion

    compileOptions {
        sourceCompatibility JavaVersion.VERSION_1_8
        targetCompatibility JavaVersion.VERSION_1_8
    }

    defaultConfig {
        applicationId "com.willofeedback"
        minSdkVersion rootProject.ext.minSdkVersion
        targetSdkVersion rootProject.ext.targetSdkVersion
        versionCode 1
        versionName "1.0"
    }
    splits {
        abi {
            reset()
            enable enableSeparateBuildPerCPUArchitecture
            universalApk false  // If true, also generate a universal APK
            include "armeabi-v7a", "x86", "arm64-v8a", "x86_64"
        }
    }
    buildTypes {
        release {
            minifyEnabled enableProguardInReleaseBuilds
            proguardFiles getDefaultProguardFile("proguard-android.txt"), "proguard-rules.pro"
        }
    }
    // applicationVariants are e.g. debug, release
    applicationVariants.all { variant ->
        variant.outputs.each { output ->
            // For each separate APK per architecture, set a unique version code as described here:
            // http://tools.android.com/tech-docs/new-build-system/user-guide/apk-splits
            def versionCodes = ["armeabi-v7a":1, "x86":2, "arm64-v8a": 3, "x86_64": 4]
            def abi = output.getFilter(OutputFile.ABI)
            if (abi != null) {  // null for the universal-debug, universal-release variants
                output.versionCodeOverride =
                        versionCodes.get(abi) * 1048576 + defaultConfig.versionCode
            }
        }
    }
}

dependencies {
    implementation project(':react-native-localize')
    implementation project(':appcenter-crashes')
    implementation project(':appcenter-analytics')
    implementation project(':appcenter')
    implementation project(':react-native-gesture-handler')
    implementation project(':react-native-device-info')
    implementation project(':@react-native-community_async-storage')
    implementation project(':react-native-vector-icons')
    implementation fileTree(dir: "libs", include: ["*.jar"])
    implementation "com.android.support:appcompat-v7:${rootProject.ext.supportLibVersion}"
    implementation "com.facebook.react:react-native:+"  // From node_modules

    implementation project(':react-native-firebase')
    implementation "com.google.android.gms:play-services-base:16.1.0"
    implementation "com.google.firebase:firebase-core:16.0.9"
    implementation "com.google.firebase:firebase-messaging:18.0.0"
    implementation 'me.leolin:ShortcutBadger:1.1.21@aar'
}

// Run this once to be able to run the application with BUCK
// puts all compile dependencies into folder libs for BUCK to use
task copyDownloadableDepsToLibs(type: Copy) {
    from configurations.compile
    into 'libs'
}

apply plugin: 'com.google.gms.google-services'

#### `android/settings.gradle`:

rootProject.name = 'willofeedback'
include ':react-native-localize'
project(':react-native-localize').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-localize/android')
include ':appcenter-crashes'
project(':appcenter-crashes').projectDir = new File(rootProject.projectDir, '../node_modules/appcenter-crashes/android')
include ':appcenter-analytics'
project(':appcenter-analytics').projectDir = new File(rootProject.projectDir, '../node_modules/appcenter-analytics/android')
include ':appcenter'
project(':appcenter').projectDir = new File(rootProject.projectDir, '../node_modules/appcenter/android')
include ':react-native-firebase'
project(':react-native-firebase').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-firebase/android')
include ':react-native-gesture-handler'
project(':react-native-gesture-handler').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-gesture-handler/android')
include ':react-native-device-info'
project(':react-native-device-info').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-device-info/android')
include ':@react-native-community_async-storage'
project(':@react-native-community_async-storage').projectDir = new File(rootProject.projectDir, '../node_modules/@react-native-community/async-storage/android')
include ':react-native-vector-icons'
project(':react-native-vector-icons').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-vector-icons/android')

include ':app'

#### `MainApplication.java`:

package com.willofeedback;

import android.app.Application;

import com.facebook.react.ReactApplication;
import com.reactcommunity.rnlocalize.RNLocalizePackage;
import com.microsoft.appcenter.reactnative.crashes.AppCenterReactNativeCrashesPackage;
import com.microsoft.appcenter.reactnative.analytics.AppCenterReactNativeAnalyticsPackage;
import com.microsoft.appcenter.reactnative.appcenter.AppCenterReactNativePackage;
import com.swmansion.gesturehandler.react.RNGestureHandlerPackage;
import com.learnium.RNDeviceInfo.RNDeviceInfo;
import com.reactnativecommunity.asyncstorage.AsyncStoragePackage;
import com.oblador.vectoricons.VectorIconsPackage;
import com.facebook.react.ReactNativeHost;
import com.facebook.react.ReactPackage;
import com.facebook.react.shell.MainReactPackage;
import com.facebook.soloader.SoLoader;


import io.invertase.firebase.notifications.RNFirebaseNotificationsPackage;
import io.invertase.firebase.RNFirebasePackage;
import io.invertase.firebase.messaging.RNFirebaseMessagingPackage;

import java.util.Arrays;
import java.util.List;

public class MainApplication extends Application implements ReactApplication {

  private final ReactNativeHost mReactNativeHost = new ReactNativeHost(this) {
    @Override
    public boolean getUseDeveloperSupport() {
      return BuildConfig.DEBUG;
    }

    @Override
    protected List<ReactPackage> getPackages() {
      return Arrays.<ReactPackage>asList(
        new MainReactPackage(),
        new RNLocalizePackage(),
        new AppCenterReactNativeCrashesPackage(MainApplication.this, getResources().getString(R.string.appCenterCrashes_whenToSendCrashes)),
        new AppCenterReactNativeAnalyticsPackage(MainApplication.this, getResources().getString(R.string.appCenterAnalytics_whenToEnableAnalytics)),
        new AppCenterReactNativePackage(MainApplication.this),
        new RNFirebaseMessagingPackage(),
        new RNFirebaseNotificationsPackage(),
        new RNFirebasePackage(),
        new RNGestureHandlerPackage(),
        new RNDeviceInfo(),
        new AsyncStoragePackage(),
        new VectorIconsPackage()
      );
    }

    @Override
    protected String getJSMainModuleName() {
      return "index";
    }
  };

  @Override
  public ReactNativeHost getReactNativeHost() {
    return mReactNativeHost;
  }

  @Override
  public void onCreate() {
    super.onCreate();
    SoLoader.init(this, /* native exopackage */ false);
  }
}

#### `AndroidManifest.xml`:

<?xml version="1.0" encoding="UTF-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    package="com.willofeedback">

    <uses-permission android:name="android.permission.INTERNET" />
    <application
        android:name=".MainApplication"
        android:label="@string/app_name"
        android:icon="@mipmap/ic_launcher"
        android:roundIcon="@mipmap/ic_launcher_round"
        android:allowBackup="false"
        android:theme="@style/AppTheme">
         <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.RNFirebaseBackgroundMessagingService" />
        <service android:name="com.willofeedback.AndroidHeadlessTasks" />
        <activity
            android:name=".MainActivity"
            android:label="@string/app_name"
            android:launchMode="singleTask"
            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>
            <intent-filter>
                <action android:name="android.intent.action.VIEW" />
                <category android:name="android.intent.category.DEFAULT" />
                <category android:name="android.intent.category.BROWSABLE" />
                <data android:scheme="willofeedback" />
            </intent-filter>
        </activity>
        <activity android:name="com.facebook.react.devsupport.DevSettingsActivity" />
    </application>
</manifest>

---

Environment

Click To Expand

- **Platform that you're experiencing the issue on**: - [ ] iOS - [x ] Android - [ ] **iOS** but have not tested behavior on Android - [ ] **Android** but have not tested behavior on iOS - [ ] Both - **Are you using `TypeScript`?** - `Y`

---

Think react-native-firebase is great? Please consider supporting all of the project maintainers and contributors by donating via our Open Collective where all contributors can submit expenses. [Learn More]

• 👉 Check out React Native Firebase and Invertase on Twitter for updates on the library.

[mikehardy]

Seems fine, I don't see any logging, are you sure its working at all? You
will see the headless task fire up as soon as you kill the app if so. Are
you sure your phone is allowing message? Dontkillmyapp.com is informative

On Fri, Jun 7, 2019, 16:42 Mickaël Mazouz [e-mail] wrote:

Issue

Hello I'm trying to receive background notifications on android
(everything works well on IOS). I can receive notifications in foreground
with the banner but in background they only appear in the notification
center, any banner is displaying!

my index.js looks like:

import { AppRegistry } from "react-native";

import App from "./src/App";

import { name as appName } from "./app.json";

import bgMessaging from "./src/tools/bgMessaging";

AppRegistry.registerComponent(appName, () => App);

AppRegistry.registerHeadlessTask("RNFirebaseBackgroundMessage", () => bgMessaging);

my bgMessaging:

export default async (message) => {

const notificationToBeDisplayed = new firebase.notifications.Notification({

data: Test',

sound: 'default',

title: 'Test',

body: 'Test'

});

if (Platform.OS === 'android') {

notificationToBeDisplayed.android

  .setPriority(firebase.notifications.Android.Priority.High)

  .android.setChannelId('Default')

  .android.setVibrate(1000);

}

await firebase.notifications().displayNotification(notificationToBeDisplayed);

}

Project Files Android Click To Expand

android/build.gradle:

// Top-level build file where you can add configuration options common to all sub-projects/modules.

buildscript {

ext {

    buildToolsVersion = "28.0.3"

    minSdkVersion = 16

    compileSdkVersion = 28

    targetSdkVersion = 28

    supportLibVersion = "28.0.0"

}

repositories {

    google()

    jcenter()

}

dependencies {

    classpath 'com.android.tools.build:gradle:3.4.1'

    classpath 'com.google.gms:google-services:4.2.0'



    // NOTE: Do not place your application dependencies here; they belong

    // in the individual module build.gradle files

}

}

allprojects {

repositories {

    mavenLocal()

    google()

    jcenter()

    maven {

        // All of React Native (JS, Obj-C sources, Android binaries) is installed from npm

        url "$rootDir/../node_modules/react-native/android"

    }

}

}

android/app/build.gradle:

apply plugin: "com.android.application"

import com.android.build.OutputFile

project.ext.react = [

entryFile: "index.js"

]

apply from: "../../node_modules/react-native/react.gradle"

/**

• Set this to true to create two separate APKs instead of one:
• 
  
  • An APK that only works on ARM devices
  
  
• 
  
  • An APK that only works on x86 devices
  
  
• The advantage is the size of the APK is reduced by about 4MB.
• Upload all the APKs to the Play Store and people will download
• the correct one based on the CPU architecture of their device.
  */
  def enableSeparateBuildPerCPUArchitecture = false

/**

• Run Proguard to shrink the Java bytecode in release builds.
  */
  def enableProguardInReleaseBuilds = false

android {

compileSdkVersion rootProject.ext.compileSdkVersion



compileOptions {

    sourceCompatibility JavaVersion.VERSION_1_8

    targetCompatibility JavaVersion.VERSION_1_8

}



defaultConfig {

    applicationId "com.willofeedback"

    minSdkVersion rootProject.ext.minSdkVersion

    targetSdkVersion rootProject.ext.targetSdkVersion

    versionCode 1

    versionName "1.0"

}

splits {

    abi {

        reset()

        enable enableSeparateBuildPerCPUArchitecture

        universalApk false  // If true, also generate a universal APK

        include "armeabi-v7a", "x86", "arm64-v8a", "x86_64"

    }

}

buildTypes {

    release {

        minifyEnabled enableProguardInReleaseBuilds

        proguardFiles getDefaultProguardFile("proguard-android.txt"), "proguard-rules.pro"

    }

}

// applicationVariants are e.g. debug, release

applicationVariants.all { variant ->

    variant.outputs.each { output ->

        // For each separate APK per architecture, set a unique version code as described here:

        // http://tools.android.com/tech-docs/new-build-system/user-guide/apk-splits

        def versionCodes = ["armeabi-v7a":1, "x86":2, "arm64-v8a": 3, "x86_64": 4]

        def abi = output.getFilter(OutputFile.ABI)

        if (abi != null) {  // null for the universal-debug, universal-release variants

            output.versionCodeOverride =

                    versionCodes.get(abi) * 1048576 + defaultConfig.versionCode

        }

    }

}

}

dependencies {

implementation project(':react-native-localize')

implementation project(':appcenter-crashes')

implementation project(':appcenter-analytics')

implementation project(':appcenter')

implementation project(':react-native-gesture-handler')

implementation project(':react-native-device-info')

implementation project(':@react-native-community_async-storage')

implementation project(':react-native-vector-icons')

implementation fileTree(dir: "libs", include: ["*.jar"])

implementation "com.android.support:appcompat-v7:${rootProject.ext.supportLibVersion}"

implementation "com.facebook.react:react-native:+"  // From node_modules



implementation project(':react-native-firebase')

implementation "com.google.android.gms:play-services-base:16.1.0"

implementation "com.google.firebase:firebase-core:16.0.9"

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

implementation 'me.leolin:ShortcutBadger:1.1.21@aar'

}

// Run this once to be able to run the application with BUCK
// puts all compile dependencies into folder libs for BUCK to use

task copyDownloadableDepsToLibs(type: Copy) {

from configurations.compile

into 'libs'

}

apply plugin: 'com.google.gms.google-services'

android/settings.gradle:

rootProject.name = 'willofeedback'

include ':react-native-localize'

project(':react-native-localize').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-localize/android')

include ':appcenter-crashes'

project(':appcenter-crashes').projectDir = new File(rootProject.projectDir, '../node_modules/appcenter-crashes/android')

include ':appcenter-analytics'

project(':appcenter-analytics').projectDir = new File(rootProject.projectDir, '../node_modules/appcenter-analytics/android')

include ':appcenter'

project(':appcenter').projectDir = new File(rootProject.projectDir, '../node_modules/appcenter/android')

include ':react-native-firebase'

project(':react-native-firebase').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-firebase/android')

include ':react-native-gesture-handler'

project(':react-native-gesture-handler').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-gesture-handler/android')

include ':react-native-device-info'

project(':react-native-device-info').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-device-info/android')

include ':@react-native-community_async-storage'

project(':@react-native-community_async-storage').projectDir = new File(rootProject.projectDir, '../node_modules/@react-native-community/async-storage/android')

include ':react-native-vector-icons'

project(':react-native-vector-icons').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-vector-icons/android')

include ':app'

MainApplication.java:

package com.willofeedback;

import android.app.Application;

import com.facebook.react.ReactApplication;
import com.reactcommunity.rnlocalize.RNLocalizePackage;
import com.microsoft.appcenter.reactnative.crashes.AppCenterReactNativeCrashesPackage;
import com.microsoft.appcenter.reactnative.analytics.AppCenterReactNativeAnalyticsPackage;
import com.microsoft.appcenter.reactnative.appcenter.AppCenterReactNativePackage;
import com.swmansion.gesturehandler.react.RNGestureHandlerPackage;
import com.learnium.RNDeviceInfo.RNDeviceInfo;
import com.reactnativecommunity.asyncstorage.AsyncStoragePackage;
import com.oblador.vectoricons.VectorIconsPackage;
import com.facebook.react.ReactNativeHost;
import com.facebook.react.ReactPackage;
import com.facebook.react.shell.MainReactPackage;
import com.facebook.soloader.SoLoader;

import io.invertase.firebase.notifications.RNFirebaseNotificationsPackage;
import io.invertase.firebase.RNFirebasePackage;
import io.invertase.firebase.messaging.RNFirebaseMessagingPackage;

import java.util.Arrays;
import java.util.List;

public class MainApplication extends Application implements ReactApplication {

private final ReactNativeHost mReactNativeHost = new ReactNativeHost(this) {

@Override

public boolean getUseDeveloperSupport() {

  return BuildConfig.DEBUG;

}



@Override

protected List<ReactPackage> getPackages() {

  return Arrays.<ReactPackage>asList(

    new MainReactPackage(),

    new RNLocalizePackage(),

    new AppCenterReactNativeCrashesPackage(MainApplication.this, getResources().getString(R.string.appCenterCrashes_whenToSendCrashes)),

    new AppCenterReactNativeAnalyticsPackage(MainApplication.this, getResources().getString(R.string.appCenterAnalytics_whenToEnableAnalytics)),

    new AppCenterReactNativePackage(MainApplication.this),

    new RNFirebaseMessagingPackage(),

    new RNFirebaseNotificationsPackage(),

    new RNFirebasePackage(),

    new RNGestureHandlerPackage(),

    new RNDeviceInfo(),

    new AsyncStoragePackage(),

    new VectorIconsPackage()

  );

}



@Override

protected String getJSMainModuleName() {

  return "index";

}

};

@Override

public ReactNativeHost getReactNativeHost() {

return mReactNativeHost;

}

@Override

public void onCreate() {

super.onCreate();

SoLoader.init(this, /* native exopackage */ false);

}

}

AndroidManifest.xml:

xmlns:android="http://schemas.android.com/apk/res/android"

package="com.willofeedback">



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

<application

    android:name=".MainApplication"

    android:label="@string/app_name"

    android:icon="@mipmap/ic_launcher"

    android:roundIcon="@mipmap/ic_launcher_round"

    android:allowBackup="false"

    android:theme="@style/AppTheme">

     <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.RNFirebaseBackgroundMessagingService" />

    <service android:name="com.willofeedback.AndroidHeadlessTasks" />

    <activity

        android:name=".MainActivity"

        android:label="@string/app_name"

        android:launchMode="singleTask"

        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>

        <intent-filter>

            <action android:name="android.intent.action.VIEW" />

            <category android:name="android.intent.category.DEFAULT" />

            <category android:name="android.intent.category.BROWSABLE" />

            <data android:scheme="willofeedback" />

        </intent-filter>

    </activity>

    <activity android:name="com.facebook.react.devsupport.DevSettingsActivity" />

</application>

---

Environment Click To Expand

• Platform that you're experiencing the issue on:
  
  
  
  • iOS
  
  
  • [x ] Android
  
  
  • iOS but have not tested behavior on Android
  
  
  • Android but have not tested behavior on iOS
  
  
  • Both
  
  
• Are you using TypeScript?
  
  
  
  • Y
  
  

---

Think react-native-firebase is great? Please consider supporting all of
the project maintainers and contributors by donating via our Open
Collective https://opencollective.com/react-native-firebase/donate
where all contributors can submit expenses. [Learn More]
https://invertase.io/oss/react-native-firebase/contributing/donations-expenses

• 👉 Check out React Native Firebase https://twitter.com/rnfirebase
  and Invertase https://twitter.com/invertaseio on Twitter for updates
  on the library.

—
You are receiving this because you are subscribed to this thread.
Reply to this email directly, view it on GitHub
https://github.com/invertase/react-native-firebase/issues/2215?email_source=notifications&email_token=AAF7C4CGS3G235WX2LGVDNTPZLI6HA5CNFSM4HV3SXBKYY3PNVWWK3TUL52HS4DFUVEXG43VMWVGG33NNVSW45C7NFSM4GYK7TQQ,
or mute the thread
https://github.com/notifications/unsubscribe-auth/AAF7C4AYHLC7XA23SLKNKITPZLI6HANCNFSM4HV3SXBA
.

[mi-mazouz]

What do you mean about logging? The only thing I need to do is get a token from firebase like that:

firebase.messaging().getToken();

I'm sure everything works well, I perfectly receive notification on ios, and in foreground on android. The only thing that is not working like I said is banner notification is not showing on background. The notification appear only in my notification center in that case.

[mikehardy]

What do you mean about logging? The only thing I need to do is get a token from firebase like that:

firebase.messaging().getToken();

Have you ever noticed that sometimes this doesn't return a token? There is latency. On CI for this project, token-related tests are flaky for this reason and I just made a change to add a 10s sleep. But if you logged all the activity you expected to happen, you'd know for sure

I'm sure everything works well,

...and yet here we are on an issue discussing it :-)

I perfectly receive notification on ios, and in foreground on android

I wouldn't relate them at all. The background modes in iOS and Android are different planets. You're checking for OS inside your headless task for instance, I don't think that's even valid. Does the headless task run on iOS? No, it's one of the differences

. The only thing that is not working like I said is banner notification is not showing on background. The notification appear only in my notification center in that case.

Have you tried registering your headless task before you register your app?
What I'm thinking is that if you put console logging in the headless task and/or look at the device logs when you kill the thing, you may or may not see the headless task actually starting up, and if you put logging in the message handler you may or may not see it fire. Until you do it we're not sure if it got hooked at all

In my app, the background message handler was great, but it was too late in the app initialization control flow for some reason and didn't work. When I made headless task registration the first thing, it worked.

[mi-mazouz]

• I'm sure I receive the token otherwise I couldn't receive foreground notifications!
• Yes I can remove the platform check from the headless task but I don't think it will solve the problem!
• Just tried to register the headless task before my app it didn't change anything!

[mikehardy]

I dunno, I'd have to see a reproduction app then

[vgm8]

I'm facing the same issue. The banner is not showing when the app is in background or closed. It's working properly when it is in foreground.

[mikehardy]

Wow, you thumbsed me down after I tried so hard to help. Your choice I guess but you realize this means I have no desire to help. Good luck.

[mi-mazouz]

@mikehardy I just did it to let the community knows that your suggestions don't work, nothing about yourself!

[gogoku]

I guess this is because of Android Oreo Update Changes , if your device has Oreo or higher
By Default the Notification lands up in a channel called Miscellaneous,
Follow the below links, this should work

https://stackoverflow.com/questions/46047343/firebase-how-to-set-default-notification-channel-in-android-app
https://firebase.google.com/docs/cloud-messaging/android/client#manifest

[mi-mazouz]

I tried to add the channelId in the headless task but nothing changed

[mikehardy]

use either react-native-firebase-starter or https://github.com/mikehardy/rnfbdemo and post a minimal reproduction

[tariqsidd]

I'm facing the same issue. The banner is not appear when the app is in background or closed. It's working properly when it is in foreground.

[amourya-systango]

Hello @mi-mazouz, you need to send the data payload only from your server like the following:

{
"to": "Your FCM_Device Token",
"data": {
"title": "Test App",
"body": "Notification for Test App",
"content_available": true,
"priority": "high"
}
}

With notification payload, it does not show the notification banner while your app is in the background or terminated state. So you need to simply remove notification payload from the payload as mentioned above.

[stale[bot]]

Hello 👋, to help manage issues we automatically close stale issues.
This issue has been automatically marked as stale because it has not had activity for quite some time. Has this issue been fixed, or does it still require the community's attention?

This issue will be closed in 15 days if no further activity occurs.
Thank you for your contributions.

[eliakorkmaz]

I solved my problem thanks to @gogoku and it can be good to check the stackoverflow link which preferred above.

In /values/strings.xml file add
<string name="default_notification_channel_id">YOUR_TEST_CHANNEL_ID</string>

Then in your /src/main/AndroidManifest.xml file add

<meta-data
       android:name="com.google.firebase.messaging.default_notification_channel_id"
       android:value="@string/default_notification_channel_id" />

in between <application> </application>

In Firebase documentation there is description about this.

(Optional) From Android 8.0 (API level 26) and higher, notification channels are supported and recommended. FCM provides a default notification channel with basic settings. If you prefer to create and use your own default channel, set default_notification_channel_id to the ID of your notification channel object as shown; FCM will use this value whenever incoming messages do not explicitly set a notification channel. To learn more, see Manage notification channels.

It worked for me, I hope it worked for all.

[stale[bot]]

Hello 👋, to help manage issues we automatically close stale issues.
This issue has been automatically marked as stale because it has not had activity for quite some time. Has this issue been fixed, or does it still require the community's attention?

This issue will be closed in 15 days if no further activity occurs.
Thank you for your contributions.

[stale[bot]]

Closing this issue after a prolonged period of inactivity. If this is still present in the latest release, please feel free to create a new issue with up-to-date information.

[yploekito]

In /values/strings.xml file add
<string name="default_notification_channel_id">YOUR_TEST_CHANNEL_ID</string>

Then in your /src/main/AndroidManifest.xml file add

<meta-data
       android:name="com.google.firebase.messaging.default_notification_channel_id"
       android:value="@string/default_notification_channel_id" />

in between <application> </application>

this worked for me thanks for sharing @eliakorkmaz

[navanit-jha]

I solved my problem thanks to @gogoku and it can be good to check the stackoverflow link which preferred above.

In /values/strings.xml file add
<string name="default_notification_channel_id">YOUR_TEST_CHANNEL_ID</string>

Then in your /src/main/AndroidManifest.xml file add

<meta-data
       android:name="com.google.firebase.messaging.default_notification_channel_id"
       android:value="@string/default_notification_channel_id" />

in between <application> </application>

In Firebase documentation there is description about this.

(Optional) From Android 8.0 (API level 26) and higher, notification channels are supported and recommended. FCM provides a default notification channel with basic settings. If you prefer to create and use your own default channel, set default_notification_channel_id to the ID of your notification channel object as shown; FCM will use this value whenever incoming messages do not explicitly set a notification channel. To learn more, see Manage notification channels.

It worked for me, I hope it worked for all.

this worked for me thanks @eliakorkmaz

[alittletf]

@navanit-jha @yploekito @eliakorkmaz @gogoku

I followed the original links and what I believe needs to happen is that I create a channel to obtain a Channel ID to get the code working you posted above. Problem is I do not know Kotlin or Java and this page leads me to believ I need to do some native coding to get this working....Is that what you all did?

here is the page (https://developer.android.com/training/notify-user/channels.html#java)

If you did use native code, do you mind pasting it here?

[mikehardy]

react-native-firebase v5 has channel creation APIs, they're in the docs. They are necessary on Android 8+ (and don't hurt to call in general, you can just call the create calls every time)

[alittletf]

@mikehardy Ha, I literally just discovered that. I appreciate you pointing me in the right direction. Unfortunately I am using RNF v6 which I am now remembering the notifications package isnt ready for prime time just yet (And that invertase will be charging for that?)....

Any idea for a temporary workaround or am I hosed for now?

EDIT: Unless, can I use RNF v5 for notifications and continue to RNF v6? or will that cause issues

[alittletf]

@mikehardy just went thru this thread https://github.com/invertase/react-native-firebase/issues/2566. It looks like I answered my own question and v5 and v6 are not interchangeable. Im going to explore react native push notification for now but im ready to pay when all that stuff is set up on your end

[alangumer]

In my case, the app was crashing when in the background, Stack trace "android.app.RemoteServiceException: Bad notification posted from package *: Couldn't create icon: StatusBarIcon".

I fixed it by following this: https://github.com/invertase/react-native-firebase/issues/1569#issuecomment-463622695 and by adding the Notification Icons to the project, which can be generated by Android Studio - Asset Studio or this web app http://romannurik.github.io/AndroidAssetStudio/icons-notification.html