React Native VoIP Push Notification

React Native VoIP Push Notification - Currently iOS >= 8.0 only

Motivation

Since iOS 8.0 there is an execellent feature called VoIP Push Notification (PushKit), while in React Native only the traditional push notification is supported which limits the possibilities of building a VoIP app with React Native (like me!).

To understand the benefits of Voip Push Notification, please see VoIP Best Practices.

Note 1: Not sure if Android support this sort of stuff since I'm neither an iOS nor Android expert, from my limited understanding that GCM's sending high priority push notification might be the case. Correct me if I'm wrong!

Note 2 This module is inspired by PushNotificationIOS and React Native Push Notification

Version

If you're using React Native >= 0.40, make sure to use react-native-voip-push-notification >= 1.1.0

Installation

npm install --save react-native-voip-push-notification

iOS

The iOS version should be >= 8.0 since we are using PushKit.

Enable VoIP Push Notification and Get VoIP Certificate

Please refer to VoIP Best Practices.

Note: Do NOT follow the Configure VoIP Push Notification part from the above link, use the instruction below instead.

AppDelegate.m Modification

...

#import <PushKit/PushKit.h>                    /* <------ add this line */
#import "RNVoipPushNotificationManager.h"      /* <------ add this line */

...

@implementation AppDelegate

- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions
{

...

/* Add PushKit delegate method */

// Handle updated push credentials
- (void)pushRegistry:(PKPushRegistry *)registry didUpdatePushCredentials:(PKPushCredentials *)credentials forType:(NSString *)type {
  // Register VoIP push token (a property of PKPushCredentials) with server
  [RNVoipPushNotificationManager didUpdatePushCredentials:credentials forType:(NSString *)type];
}

// Handle incoming pushes
- (void)pushRegistry:(PKPushRegistry *)registry didReceiveIncomingPushWithPayload:(PKPushPayload *)payload forType:(NSString *)type {
  // Process the received push
  [RNVoipPushNotificationManager didReceiveIncomingPushWithPayload:payload forType:(NSString *)type];
}

...

@end

Add PushKit Framework

• In your Xcode project, select Build Phases --> Link Binary With Libraries
• Add PushKit.framework

Add RNVoipPushNotification

Option 1: Use rnpm

rnpm link react-native-voip-push-notification

Note: If you're using rnpm link make sure the Header Search Paths is recursive. (In step 3 of manually linking)

Option 2: Manually

1. Drag node_modules/react-native-voip-push-notification/ios/RNVoipPushNotification.xcodeproj under <your_xcode_project>/Libraries
2. Select <your_xcode_project> --> Build Phases --> Link Binary With Libraries

• Drag Libraries/RNVoipPushNotification.xcodeproj/Products/libRNVoipPushNotification.a to Link Binary With Libraries

3. Select <your_xcode_project> --> Build Settings

• In Header Search Paths, add $(SRCROOT)/../node_modules/react-native-voip-push-notification/ios/RNVoipPushNotification with recursive

Usage

...

import VoipPushNotification from 'react-native-voip-push-notification';

...

class MyComponent extends React.Component {

...

  componentWillMount() { // or anywhere which is most comfortable and appropriate for you
    VoipPushNotification.requestPermissions(); // required
  
    VoipPushNotification.addEventListener('register', (token) => {
      // send token to your apn provider server
    });

    VoipPushNotification.addEventListener('notification', (notification) => {
      // register your VoIP client, show local notification, etc.
      // e.g.
      this.doRegister();
      
      /* there is a boolean constant exported by this module called
       * 
       * wakeupByPush
       * 
       * you can use this constant to distinguish the app is launched
       * by VoIP push notification or not
       *
       * e.g.
       */
       if (VoipPushNotification.wakeupByPush) {
         // do something...

         // remember to set this static variable to false
         // since the constant are exported only at initialization time
         // and it will keep the same in the whole app
         VoipPushNotification.wakeupByPush = false;
       }

      /**
       * Local Notification Payload
       *
       * - `alertBody` : The message displayed in the notification alert.
       * - `alertAction` : The "action" displayed beneath an actionable notification. Defaults to "view";
       * - `soundName` : The sound played when the notification is fired (optional).
       * - `category`  : The category of this notification, required for actionable notifications (optional).
       * - `userInfo`  : An optional object containing additional notification data.
       */
      VoipPushNotification.presentLocalNotification({
          alertBody: "hello! " + notification.getMessage()
      });
    });
  }

...

}

Contributing

Any pull request, issue report and suggestion are highly welcome!

License

ISC License (functionality equivalent to MIT License)