iOS React Native Setup

Last Edit: Mar 03 2020

For iOS, we will be using Apple’s APN service to power the push functionality, rather than Expo or Firebase Cloud Messaging. react-native-push-notification internally use PushNotificationIOS for iOS part.

Step 1 - Link the PushNotificationIOS library

There are a couple of cases for linking. Choose the appropriate one:

  • react-native >= 0.60

The package is automatically linked when building the app. Although you will have to add following pod dependency for PushNotificationIOS to your podfile (which you can find in ios folder).


pod 'RNCPushNotificationIOS', :path => '../node_modules/@react-native-community/push-notification-ios/RNCPushNotificationIOS.podspec'
                    

And then install pod dependencies by running following command:


cd ios && pod install
                    
  • react-native <= 0.59

You can either link the PushNotificationIOS library by running following command:


react-native unlink @react-native-community/push-notification-ios
                    

Or if you don't want to use the method above, you can always link the library manually.

Step 2 - Setup the Imports

Navigate to AppDelegate.m in your project.

Add the following import just below #import "AppDelegate.h".


#import "AppDelegate.h"

#import <RNCPushNotificationIOS.h> // <-- THIS
                    

Step 3 - Integrate

Add the following snippet to the bottom of the file, just before @end.


// Required to register for notifications
- (void)application:(UIApplication *)application didRegisterUserNotificationSettings:(UIUserNotificationSettings *)notificationSettings
{
  [RNCPushNotificationIOS didRegisterUserNotificationSettings:notificationSettings];
}
// Required for the register event.
- (void)application:(UIApplication *)application didRegisterForRemoteNotificationsWithDeviceToken:(NSData *)deviceToken
{
  [RNCPushNotificationIOS 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
{
  [RNCPushNotificationIOS didReceiveRemoteNotification:userInfo fetchCompletionHandler:completionHandler];
}
// Required for the registrationError event.
- (void)application:(UIApplication *)application didFailToRegisterForRemoteNotificationsWithError:(NSError *)error
{
  [RNCPushNotificationIOS didFailToRegisterForRemoteNotificationsWithError:error];
}
// Required for the localNotification event.
- (void)application:(UIApplication *)application didReceiveLocalNotification:(UILocalNotification *)notification
{
  [RNCPushNotificationIOS didReceiveLocalNotification:notification];
}
                    

Running On iOS Devices

Unfortunately, push notifications do not work in the iOS simulator, so you’re going to need a physical iOS device to be able to see the fruits of your labor.

If you want to run your React Native application on a device, you’re going to have to edit the XCode project to include code signing and push capabilities:

Step 1:

In XCode, from the navigation bar on the left make sure your project is selected. Navigate to the General tab.

Step 2

Expand Signing and make sure you are logged in with your Apple Developer Account. Once logged in, select your development team and be sure to check Automatically Manage Signing.

Step 3

Expand Identity and make sure your Bundle Identifier matches the one you used to configure push notifications with Stream. If you haven’t done this yet, please refer to the docs here and then return to this tutorial.

Step 4

Navigate to the Capabilities tab and make sure Push Notifications are enabled

Step 5

You’re all set! Plug in your iOS device, select it from the run menu in XCode and press Run.