在 Firebase 云消息传递中，React 本机应用程序未通过 TOPIC 接收通知

Question

I have configured the react-native to the best of my knowledge using some documentations. The react native app receives notifications properly when selecting the whole app as the target.But I am not able to get the same when sending via topics from the firebase console. What am I doing wrong? Thanks in advance

Screen shot of receiving notification via app as target. [1]: https://i.stack.imgur.com/8huVS.png

Code

PushNotifHelper

    import messaging from '@react-native-firebase/messaging';

    const TOPIC = 'patient-topic';

    export const requestUserPermission = async () => {
      //On ios,checking permission before sending and receiving messages
      const authStatus = await messaging().requestPermission();
      return (
        authStatus === messaging.AuthorizationStatus.AUTHORIZED ||
        authStatus === messaging.AuthorizationStatus.PROVISIONAL
      );
    };

    export const getFcmToken = () => {
      // Returns an FCM token for this device
      messaging()
        .getToken()
        .then(fcmToken => {
          console.log('FCM Token -> ', fcmToken);
        });
    };

    export const receiveNotificationFromQuitState = () => {
      messaging()
        .getInitialNotification()
        .then(async remoteMessage => {
          if (remoteMessage) {
            console.log(
              'getInitialNotification:' +
                'Notification caused app to open from quit state',
            );
          }
        });
    };

    export const receiveBackgroundNotification = () => {
      messaging().onNotificationOpenedApp(async remoteMessage => {
        if (remoteMessage) {
          console.log(
            'onNotificationOpenedApp: ' +
              'Notification caused app to open from background state',
          );
        }
      });
    };

    //stop listening for new messages.
    export const unsubscribeDeviceTopic = messaging().onMessage(
      async remoteMessage => {
        console.log('New notification arrived' + JSON.stringify(remoteMessage));
      },
    );

    export const backgroundThread = () => {
      //It's called when the app is in the background or terminated
      messaging().setBackgroundMessageHandler(async remoteMessage => {
        console.log('Background notification' + JSON.stringify(remoteMessage));
      });
    };

    export const subscribeTopicToGetNotification = () => {
      /**
       * based on Topic, FCM server to send targeted
       * messages to only those devices subscribed to that topic
       */
      messaging()
        .subscribeToTopic(TOPIC)
        .then(() => {
          console.log(`Topic: ${TOPIC} Suscribed`);
        });
    };

Initialising inside useEffect

    useEffect(() => {
        async function setupPatientNotification() {
          if (await requestUserPermission()) {
            getFcmToken();
          } else {
            console.log('Not Authorization status');
          }
        }
        receiveNotificationFromQuitState();
        receiveBackgroundNotification();
        subscribeTopicToGetNotification();
        backgroundThread();
        return () => {
          unsubscribeDeviceTopic;
          // messaging().unsubscribeFromTopic(TOPIC);
        };
      }, []);

Answer 1

I was facing the same issue on my side because I have a separate subscribed topic without waiting to retrieve a token from Firebase.

I think you need to move to subscribe topic after the system gets Fcm Token or after authorization notification permission.

This is an example of my code, now it works properly.

useEffect(() => {
    (async () => {
      await createChannelId();
      const authorizationStatus = await requestUserPermission();
      await messaging().registerDeviceForRemoteMessages();
      if (authorizationStatus) {
        const fcmToken = await messaging().getToken();
        setItem(FCM_TOKEN, fcmToken);
        subscribeTopic(NotificationTopics.ApplicationUpdate);
      }
    })();
  }, []);