React-native-push-notification: Token not registering to device?

Created on 29 Jan 2019  路  7Comments  路  Source: zo0r/react-native-push-notification

When sending test notifications through FCM, my device receives them if I target the entire application, but I am not receiving anything when targeting the specific token I am receiving in onRegister (iOS only, Android is working fine)

Can anyone help?

I've followed every step for implementation, and remote notifications are receiving and showing as I want them except when I try to target a specific device.

Most helpful comment

I was facing the same issue. Here is how I fixed it (iOS specific, android was working out of the box)-

  1. Uninstall the app from your phone
  2. Clear ALL the tokens stored in your database for this particular account(or however you have set it up in your backend. In my case, tokens are tied to the account)
  3. In componentDidmount-
      async componentDidMount() {
        this.checkPermission();
        this.createNotificationListeners();
      }

4.

  async checkPermission() {
    const enabled = await firebase.messaging().hasPermission();
    if (enabled) {
      this.getToken();
    } else {
      this.requestPermission();
    }
  }

  async requestPermission() {
    try {
      await firebase.messaging().requestPermission();
      // User has authorised
      this.getToken();
    } catch (error) {
      // User has rejected permissions
      console.log('permission rejected');
    }
  }

  async getToken() {
    try {
      const enabled = await firebase.messaging().hasPermission();
      if (!enabled) {
        await firebase.messaging().requestPermission();
      }

      const fcmToken = await firebase.messaging().getToken();
      if (fcmToken) {
        console.log("got token");
        console.log('fcm token:', fcmToken); //-->use this token from the console to send a post request via postman
        this.setState({ fcmToken });
        return fcmToken;
      }
    } catch (error) {
      console.warn('notification token error', error);
    }
  }

5.

 async createNotificationListeners() {
    /*
    * Triggered when a particular notification has been received in foreground
    * */
    this.notificationListener = firebase.notifications().onNotification((notification) => {
        const { title, body } = notification;
        this.showAlert(title, body);
    });

    /*
    * If your app is in background, you can listen for when a notification is clicked / tapped / opened as follows:
    * */
    this.notificationOpenedListener = firebase.notifications().onNotificationOpened((notificationOpen) => {
        const { title, body } = notificationOpen.notification;
        this.showAlert(title, body);
    });

    /*
    * If your app is closed, you can check if it was opened by a notification being clicked / tapped / opened as follows:
    * */
    const notificationOpen = await firebase.notifications().getInitialNotification();
    if (notificationOpen) {
        const { title, body } = notificationOpen.notification;
        this.showAlert(title, body);
    }
    /*
    * Triggered for data only payload in foreground
    * */
    this.messageListener = firebase.messaging().onMessage((message) => {
      //process data message
      console.log(JSON.stringify(message));
    });
  }
  1. Finally, use the token that you see in the console as a value for the "to" key in your post request. You should no longer see the "notRegistered" error and should be getting push notifications.
    Done!!

For a more detailed setup/citation-
https://medium.com/@anum.amin/react-native-integrating-push-notifications-using-fcm-349fff071591

All 7 comments

Did you find what was the problem?

@VicEsquivel I did, my issue was that while the Android side was generating an FCM token, the iOS side was generating a GCM token. This was incredibly confusing and I'm not sure why it behaves this way, or what I could have done to properly generate an FCM token with this library. I ended up just grabbing the tokens from firebase itself.

@d-vincent Hmm, you mean grabbing the tokens directly from firebase console?

Because in my case I haven't managed to make the IOS version connect correctly to the firebase console to retrieve a valid FCM registration token...

I followed this troubleshooting guide which was pretty useful.

The token that the onRegister event from this library is returning, in my case is a 64 char length string, which turns to be the APNS token itself, that is why I successfully tested until point 4 in the guide, I could send a push notification to IOS using the NWPusher that they mention, using this 64 length token.

While testing point 5 with a curl, I got the InvalidRegistration error. So I deducted that maybe this library is never doing the firebase registration and that is why the token is not a FCM token at all.

After all it makes sense, this library has a little to none IOS native code, all the implementation in the readme is using react-native native's component PushNotificationIOS.

@VicEsquivel I use react-native-firebase, so I am able to call "firebase.messaging().getToken()" to grab the FCM token, and then use it in the same way I would use a token from onRegister

I was facing the same issue. Here is how I fixed it (iOS specific, android was working out of the box)-

  1. Uninstall the app from your phone
  2. Clear ALL the tokens stored in your database for this particular account(or however you have set it up in your backend. In my case, tokens are tied to the account)
  3. In componentDidmount-
      async componentDidMount() {
        this.checkPermission();
        this.createNotificationListeners();
      }

4.

  async checkPermission() {
    const enabled = await firebase.messaging().hasPermission();
    if (enabled) {
      this.getToken();
    } else {
      this.requestPermission();
    }
  }

  async requestPermission() {
    try {
      await firebase.messaging().requestPermission();
      // User has authorised
      this.getToken();
    } catch (error) {
      // User has rejected permissions
      console.log('permission rejected');
    }
  }

  async getToken() {
    try {
      const enabled = await firebase.messaging().hasPermission();
      if (!enabled) {
        await firebase.messaging().requestPermission();
      }

      const fcmToken = await firebase.messaging().getToken();
      if (fcmToken) {
        console.log("got token");
        console.log('fcm token:', fcmToken); //-->use this token from the console to send a post request via postman
        this.setState({ fcmToken });
        return fcmToken;
      }
    } catch (error) {
      console.warn('notification token error', error);
    }
  }

5.

 async createNotificationListeners() {
    /*
    * Triggered when a particular notification has been received in foreground
    * */
    this.notificationListener = firebase.notifications().onNotification((notification) => {
        const { title, body } = notification;
        this.showAlert(title, body);
    });

    /*
    * If your app is in background, you can listen for when a notification is clicked / tapped / opened as follows:
    * */
    this.notificationOpenedListener = firebase.notifications().onNotificationOpened((notificationOpen) => {
        const { title, body } = notificationOpen.notification;
        this.showAlert(title, body);
    });

    /*
    * If your app is closed, you can check if it was opened by a notification being clicked / tapped / opened as follows:
    * */
    const notificationOpen = await firebase.notifications().getInitialNotification();
    if (notificationOpen) {
        const { title, body } = notificationOpen.notification;
        this.showAlert(title, body);
    }
    /*
    * Triggered for data only payload in foreground
    * */
    this.messageListener = firebase.messaging().onMessage((message) => {
      //process data message
      console.log(JSON.stringify(message));
    });
  }
  1. Finally, use the token that you see in the console as a value for the "to" key in your post request. You should no longer see the "notRegistered" error and should be getting push notifications.
    Done!!

For a more detailed setup/citation-
https://medium.com/@anum.amin/react-native-integrating-push-notifications-using-fcm-349fff071591

I am having the same problem, the token generated on ios is not a valid FCM token

Guys, Any solutions?

Was this page helpful?
0 / 5 - 0 ratings