54874

Can't get iOS push notification device token in react-native

Question:

I referred to <a href="https://stackoverflow.com/questions/35387227/get-device-token-with-react-native" rel="nofollow">this question</a> to get a device token in order to send push notifications to my app. I created my app using create-react-native-app. Here is the code:

<pre class="lang-js prettyprint-override">import React, { Component } from 'react'; import { Platform, StyleSheet, AppRegistry, Text, View, PushNotificationIOS } from 'react-native'; type Props = {}; export default class Apptitude extends Component<Props> { constructor() { console.log('registering evt listerner in launchpad') PushNotificationIOS.addEventLister('register', (token) => { this.setState({ deviceToken: token }) }); } render() { return ( <View> </View> ); } } PushNotificationIOS.addEventListener('registrationError', (registrationError) => { console.lo('was error') console.log(reason.message) console.log(reason.code) console.log(reason.details) }) // yes I'm aware I've added an event listener in the constructor also. Neither of these callbacks fire PushNotificationIOS.addEventListener('register', (token) => { console.log('this is the token', token); }); console.log('requesting permissions') PushNotificationIOS.requestPermissions();

The problem is that the register and the registrationError events never fire. I am prompted to approve permissions and next time the app starts I can use checkPermissions() and confirm that permissions are given. But without the device token, it's impossible to send push notifications to the device. What am I doing wrong?

Answer1:

How about the Xcode part?

You should import TCTPushNotification on you AppDelegate file

<pre class="lang-js prettyprint-override">#import <React/RCTPushNotificationManager.h>

and implement the follow code to enable the notification and register in your app

<pre class="lang-js prettyprint-override"> // Required to register for notifications - (void)application:(UIApplication *)application didRegisterUserNotificationSettings:(UIUserNotificationSettings *)notificationSettings { [RCTPushNotificationManager didRegisterUserNotificationSettings:notificationSettings]; } // Required for the register event. - (void)application:(UIApplication *)application didRegisterForRemoteNotificationsWithDeviceToken:(NSData *)deviceToken { [RCTPushNotificationManager didRegisterForRemoteNotificationsWithDeviceToken:deviceToken]; } // Required for the notification event. You must call the completion handler after handling the remote notification. - (void)application:(UIApplication *)application didReceiveRemoteNotification:(NSDictionary *)userInfo fetchCompletionHandler:(void (^)(UIBackgroundFetchResult))completionHandler { [RCTPushNotificationManager didReceiveRemoteNotification:userInfo fetchCompletionHandler:completionHandler]; } // Required for the registrationError event. - (void)application:(UIApplication *)application didFailToRegisterForRemoteNotificationsWithError:(NSError *)error { [RCTPushNotificationManager didFailToRegisterForRemoteNotificationsWithError:error]; } // Required for the localNotification event. - (void)application:(UIApplication *)application didReceiveLocalNotification:(UILocalNotification *)notification { [RCTPushNotificationManager didReceiveLocalNotification:notification]; }

For more information use the official docs

<a href="https://facebook.github.io/react-native/docs/pushnotificationios.html" rel="nofollow">https://facebook.github.io/react-native/docs/pushnotificationios.html</a>

?

Answer2:

The other thing to be aware of is that on the simulator the onRegister function is not fired, you have to use a real device.

Recommend