React-native-firebase: Notification not showing up in foreground - only warning (Android)

[AlMel3000]

Environment

1. Application Target Platform:

Android

1. Development Operating System:

Windows 10

IntelliJ IDEA, minSdkVersion 18, targetSdkVersion 22, IntelliJ IDEA 2017.3.4

1. Build Tools:

'com.android.tools.build:gradle:3.1.0'
'com.google.gms:google-services:3.2.1' (also tested an 3.2.0)

1. React Native version:

0.54.4

1. RNFirebase Version:

4.0.0

---

Error description

So in the background notifications are working perfect, but in the foreground I see only warning (not demanded by me) and some error in logs.

Warning is:

Js code is:

`import React, {Component} from 'react';

import {StackNavigator} from 'react-navigation';

import {Animated, Platform, StyleSheet, View} from 'react-native';

import firebase from 'react-native-firebase';

import type { RemoteMessage } from 'react-native-firebase';

import AppContainer from './AppContainer';

import Splash from '../components/screens/Splash';

import {client} from "../apollo/index";

import { ApolloProvider } from 'react-apollo';

const NavContainer = StackNavigator(
{
Splash: {screen: Splash},
AppContainer: {screen: AppContainer},
},
{headerMode: 'none'}
);

const CHANNEL_ID = "com.sometitle1.sometitle2";

export default class ApplicationNavContainer extends Component {

constructor() {
    super();
    this.state = {

    };
}



componentDidMount() {
    this.checkFirebase();

}

async checkFirebase(){
    const enabled = await firebase.messaging().hasPermission();
    if (enabled) {
        // user has permissions
        this.registerFbCloudMessagingListener()
    } else {
        // user doesn't have permission
        this.requestFbPermission()
    }
}

async requestFbPermission(){
    try {
        let permission = await firebase.messaging().requestPermission();
        if (permission) {
            this.checkFirebase();
        }
        // User has authorised
    } catch (error) {
        // User has rejected permissions
    }
}

registerFbCloudMessagingListener(){
    this.getToken();
    firebase.messaging().subscribeToTopic('com.emercoin.emernotar.localization')
    this.messageListener = firebase.messaging().onMessage((message: RemoteMessage) => {
        // Process your message as required
        console.warn("FIREBASE_MESSAGE", message)
    });

    this.notificationListener = firebase.notifications().onNotification((notification) => {
        const localNotification = new firebase.notifications.Notification({
            sound: 'default',
            show_in_foreground: true,
        })
            .setNotificationId(notification.notificationId)
            .setTitle(notification.title)
            .setSubtitle(notification.subtitle)
            .setBody(notification.body);

        if (Platform.OS === 'android') {
            localNotification
                .android.setChannelId(CHANNEL_ID)
                .android.setSmallIcon('notification_logo')
                .android.setColor('#FFFFFF')
                .android.setPriority(firebase.notifications.Android.Priority.High);
        }

        if (Platform.OS === 'ios') {
            localNotification
                .ios.setBadge(notification.ios.badge);
        }

        firebase.notifications().displayNotification(localNotification);
    });
}

async getToken(){
let token = await firebase.messaging().getToken();
console.warn("FIREBASE TOKEN", token)

}
render() {...}

...`

bgMessaging.js is:

`// @flow
import firebase from 'react-native-firebase';
// Optional flow type
import type { RemoteMessage } from 'react-native-firebase';

export default async (message: RemoteMessage) => {
// handle your message
console.warn("FIREBASE_NOTIFICATION", message)
return Promise.resolve(message);
}`

AndroidManifest.xml is:

` package="com.sometitle1.sometitle2"
android:versionCode="1"
android:versionName="1.0">

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

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

<uses-sdk
        android:minSdkVersion="16"
        android:targetSdkVersion="22"/>

<application
        android:name=".MainApplication"
        android:allowBackup="true"
        android:label="@string/app_name"
        android:icon="@mipmap/ic_launcher"
        android:theme="@style/AppTheme">

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

    <meta-data
            android:name="com.google.firebase.messaging.default_notification_icon"
            android:resource="@drawable/notification_logo"/>
    <!-- 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"/>

    <activity
            android:name=".MainActivity"
            android:label="@string/app_name"
            android:launchMode="singleTop"
            android:configChanges="keyboard|keyboardHidden|orientation|screenSize"
            android:windowSoftInputMode="adjustResize"
            android:screenOrientation="portrait">
        <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"/>
    <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"/>
    <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>
</application>

`

strings.xml is:

<resources> <string name="app_name">sometitle2</string> <string name="notification_channel_id">com.sometitle1.sometitle2</string> </resources>

Error in logs is:

04-27 14:22:43.938 22219-22402/? W/Bundle: Attempt to cast generated internal exception: java.lang.ClassCastException: java.util.ArrayList cannot be cast to java.lang.String[] at android.os.BaseBundle.getStringArray(BaseBundle.java:1472) at io.invertase.firebase.notifications.RNFirebaseNotificationManager.displayNotification(RNFirebaseNotificationManager.java:344) at io.invertase.firebase.notifications.RNFirebaseNotificationManager.displayNotification(RNFirebaseNotificationManager.java:134) at io.invertase.firebase.notifications.RNFirebaseNotifications.displayNotification(RNFirebaseNotifications.java:76) at java.lang.reflect.Method.invoke(Native Method) at com.facebook.react.bridge.JavaMethodWrapper.invoke(JavaMethodWrapper.java:374) at com.facebook.react.bridge.JavaModuleWrapper.invoke(JavaModuleWrapper.java:162) at com.facebook.react.bridge.queue.NativeRunnable.run(Native Method) at android.os.Handler.handleCallback(Handler.java:790) at android.os.Handler.dispatchMessage(Handler.java:99) at com.facebook.react.bridge.queue.MessageQueueThreadHandler.dispatchMessage(MessageQueueThreadHandler.java:31) at android.os.Looper.loop(Looper.java:164) at com.facebook.react.bridge.queue.MessageQueueThreadImpl$3.run(MessageQueueThreadImpl.java:194) at java.lang.Thread.run(Thread.java:764)

And error refers to:

if (android.containsKey("people")) { String[] people = android.getStringArray("people"); if (people != null) { for (String person : people) { nb = nb.addPerson(person); } } }

Message sent by our server is:

message = messaging.Message( notification=messaging.Notification( title='Your someThing', body='Your someThing is someAction! Check your email from someService for download it!', ), token=registration_token, )

In my project I used a way:

http://invertase.link/get-started-basic

[qDanik]

use my template https://github.com/qDanik/react-native-template

[chrisbianca]

@AlMel3000 Update to v4.0.6 - this has been fixed.

[AlMel3000]

"react-native-firebase": "^4.0.6",

Now I see in logs 04-28 09:25:25.264 24830-24830/com.sometitle1.sometitle2 D/RNFirebaseNotifications: Received new remote notification

But also I don't see any notification. Instead of this I see the same warning

[chrisbianca]

@AlMel3000 Can you check, see if there are any other errors in your logs?

[AlMel3000]

Chris, in logs 04-28 09:25:25.264 24830-24830/com.sometitle1.sometitle2 D/RNFirebaseNotifications: Received new remote notification
only

[chrisbianca]

I'm not sure how to help with this - the warning is coming from the Android OS, and without the log that it mentions we've got no way to figure out what's going wrong...

[AlMel3000]

@qDanik your solution works.
Thank you very much.