messaging().onNotificationOpenedApp is never triggered, messaging().getInitialNotification() is triggered but remoteMessage is always null

Question

I'm using react-native-firebase v6.4.0. I successfully registered a background handler with setBackgroundMessageHandler and everything works fine. Now I'm trying to handle notification tap when the app is in background/quit and I'm using onNotificationOpenedApp/getInitialNotification. The problem I'm facing is that the first method is never triggered while the second is triggered but remoteMessage parameter is always null. I've also tried to generate a release build but the result is the same.

index.js

// imports

messaging().setBackgroundMessageHandler(async remoteMessage => {
  // storing the message with redux
});

function HeadlessCheck({isHeadless}) {
  return isHeadless ? null : <App />;
}

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

App.js

// other imports
import messaging from '@react-native-firebase/messaging';
import {store, persistor} from './Store';

export default function App() {
  useEffect(() => {
    (async () => await messaging().registerDeviceForRemoteMessages())();

    const unsubscribe = messaging().onMessage(async remoteMessage => {
      store.dispatch(storeNews(remoteMessage));
    });

    messaging().onNotificationOpenedApp(remoteMessage => {
      // The below code gets never executed
      Alert.alert('here');
      console.log(
        'Notification caused app to open from background state:',
        remoteMessage,
      );
    });

    messaging()
      .getInitialNotification()
      .then(remoteMessage => {
        console.log(remoteMessage); // always prints null
        if (remoteMessage) {
          // Never reached
          Alert.alert('here');
          console.log(
            'Notification caused app to open from quit state:',
            remoteMessage,
          );
        }
      });

    return unsubscribe;
  }, []);

  return (
    <>
      <StatusBar barStyle="dark-content" />
      <Provider store={store}>
        <PersistGate loading={null} persistor={persistor}>
          <RootNavigator />
        </PersistGate>
      </Provider>
    </>
  );
}

react-native info:

System:
    OS: Windows 10 10.0.18363
    CPU: (8) x64 Intel(R) Core(TM) i7-8550U CPU @ 1.80GHz
    Memory: 6.90 GB / 15.73 GB
  Binaries:
    Node: 10.15.3 - C:\Program Files\nodejs\node.EXE
    Yarn: 1.9.4 - C:\Users\user\AppData\Roaming\npm\yarn.CMD
    npm: 6.14.1 - C:\Program Files\nodejs\npm.CMD
  SDKs:
    Android SDK:
    API Levels: 21, 22, 23, 24, 25, 26, 27, 28
    Build Tools: 23.0.1, 25.0.0, 26.0.1, 26.0.2, 26.0.3, 27.0.3, 28.0.2, 28.0.3
    System Images: Google APIs Intel x86 Atom, android-27
Intel x86 Atom
  IDEs:
    Android Studio: Version  3.5.0.0 AI-191.8026.42.35.6010548
  npmPackages:
    react: 16.9.0 => 16.9.0
    react-native: 0.61.5 => 0.61.5

package.json:

{
  ...
  "@react-native-firebase/app": "^6.4.0",
  "@react-native-firebase/messaging": "^6.4.0",
  ...
}

I tried to run the code on both a physical Android device and on an Android emulator and I got the same behaviour.

Physical device specs:

Model code: SM-G975F 
Android version: 10

Emulator specs:

Name: Nexus_5X_API_27_x86
Device: Nexus 5X (Google)
Path: C:\Users\user\.android\avd\Nexus_5X_API_27_x86.avd
Based on: Android API 27 Tag/ABI: google_apis/x86

I appreciate any help. Many thanks in advance.

score 14 · Accepted Answer · answered Apr 17 '20 at 01:53

I find what cause my problem. I have in my app a config for native Splash Screen, implementation necessary to use the react-native-splash-screen package.

I added a news file called SplashActivity.java:

public class SplashActivity extends AppCompatActivity {
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        try {
            super.onCreate(savedInstanceState);
            Intent intent = new Intent(this, MainActivity.class);
            startActivity(intent);
            finish();
       }
        catch(Exception e) {
           System.out.println(e.getMessage());
       }

I mande the SplashActivity my main Activity , in AndroidManifest.xml:

       <activity
          android:name=".SplashActivity"
          android:theme="@style/SplashTheme"
          android:label="@string/app_name">
          <intent-filter>
              <action android:name="android.intent.action.MAIN" />
              <category android:name="android.intent.category.LAUNCHER" />
          </intent-filter>
        </activity>

      <activity
        android:name=".MainActivity"
        android:label="@string/app_name"
        android:configChanges="keyboard|keyboardHidden|orientation|screenSize"
        android:windowSoftInputMode="adjustResize"
        android:exported="true" />

Then changes some logic on my MainActivity.java, that looks like :

import android.os.Bundle;
import org.devio.rn.splashscreen.SplashScreen;
public class MainActivity extends ReactActivity {
 @Override
    protected void onCreate(Bundle savedInstanceState) {
        SplashScreen.show(this);
        super.onCreate(savedInstanceState);
    }
}

So the events are not passed correctly, more information about see this comments on this react-native-firebase repo's issue

More explanations problem on this comment

My solution to this problem is pretty implementation specific, but you never know what might help.

My issue was that I had a splash activity which was the actual launcher activity. To get the callbacks to fire in App.js I had to: Add "singleTop" to the activity tag for SplashActivity.java in AndroidManifest.xml Use "this.getIntent();" within the onCreate method of SplashActivity.java to intercept the intent from the firebase notification open event Use .getExtras() to take the bundle from the intercepted intent and attach it to a new intent forwarded to .MainActivity As soon as .MainActivity had access to the intent all of the callbacks began firing on the correct events.

Implementation to solve the problem on this comment

So I added this logic on may SplashActivity:

        Bundle extras = getIntent().getExtras();
        if (extras != null) {
            intent.putExtras(extras);
        }

Now looks like:

public class SplashActivity extends AppCompatActivity {
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        try {
  //  Block of code to try
        super.onCreate(savedInstanceState);

        Intent intent = new Intent(this, MainActivity.class);

        // Pass along FCM messages/notifications etc.
        Bundle extras = getIntent().getExtras();
        if (extras != null) {
            intent.putExtras(extras);
        }
        startActivity(intent);
        finish();
}
catch(Exception e) {
  //  Block of code to handle errors
  System.out.println(e.getMessage());
}
    }
}

Now I can get getInitialNotification() return and onNotificationOpenedApp() events. On Android if the app is in background or quit state is always called getInitialNotification(), this is probably because my logic from Splash Screen. But for me it's OK for now, I would do exactly the same thing on both

I had the same problem, your solution worked brilliantly. Thank you — Stefano Martella, Apr 17 '20 at 07:47
@kasra No need for separate activity, you can directly use SplashScreen.show(this) in the MainActivity and you will receive getInitialNotification() for both the events — Voonic, Oct 07 '20 at 08:41
I don't use any SplashScreen packages, but I still have this problem. Any other ideas? — F. Eser, Dec 01 '21 at 15:41

messaging().onNotificationOpenedApp is never triggered, messaging().getInitialNotification() is triggered but remoteMessage is always null

1 Answers1