React Native Push Notifications

React Native Local and Remote Notifications for iOS and Android

Installation

npm install react-native-push-notification

iOS Installation

The component uses PushNotificationIOS for the iOS part.

Please see: PushNotificationIOS

Android Installation

In your AndroidManifest.xml

 .....
<permissionandroid:name="${applicationId}.permission.C2D_MESSAGE"android:protectionLevel="signature" />
<uses-permissionandroid:name="${applicationId}.permission.C2D_MESSAGE" />
<uses-permissionandroid:name="android.permission.WAKE_LOCK" />
<uses-permissionandroid:name="android.permission.VIBRATE" />
<application ....>
<receiverandroid:name="com.google.android.gms.gcm.GcmReceiver"android:exported="true"android:permission="com.google.android.c2dm.permission.SEND" >
<intent-filter>
<actionandroid:name="com.google.android.c2dm.intent.RECEIVE" />
<categoryandroid:name="${applicationId}" />
</intent-filter>
</receiver>
<serviceandroid:name="com.dieam.reactnativepushnotification.modules.RNPushNotificationRegistrationService"/>
<serviceandroid:name="com.dieam.reactnativepushnotification.modules.RNPushNotificationListenerService"android:exported="false" >
<intent-filter>
<actionandroid:name="com.google.android.c2dm.intent.RECEIVE" />
</intent-filter>
</service>
.....

In android/settings.gradle

...
include ':react-native-push-notification'
project(':react-native-push-notification').projectDir = file('../node_modules/react-native-push-notification/RNPushNotificationAndroid')

In android/app/build.gradle

...
dependencies {
...
compile project(':react-native-push-notification')
}

Register module (in MainActivity.java)

importcom.dieam.reactnativepushnotification.ReactNativePushNotificationPackage; // <--- ImportpublicclassMainActivityextendsActivityimplementsDefaultHardwareBackBtnHandler {
......
privateReactInstanceManagermReactInstanceManager;
privateReactRootViewmReactRootView;
privateReactNativePushNotificationPackagemReactNativePushNotificationPackage; // <------ Add Package Variable@OverrideprotectedvoidonCreate(BundlesavedInstanceState) {
super.onCreate(savedInstanceState);
mReactRootView = newReactRootView(this);
mReactNativePushNotificationPackage = newReactNativePushNotificationPackage(this); // <------ Initialize the PackagemReactInstanceManager = ReactInstanceManager.builder()
.setApplication(getApplication())
.setBundleAssetName("index.android.bundle")
.setJSMainModuleName("index.android")
.addPackage(newMainReactPackage())
.addPackage(mReactNativePushNotificationPackage) // <------ Add the Package
.setUseDeveloperSupport(BuildConfig.DEBUG)
.setInitialLifecycleState(LifecycleState.RESUMED)
.build();
mReactRootView.startReactApplication(mReactInstanceManager, "ExampleApp", null);
setContentView(mReactRootView);
}
// Add onNewIntent@OverrideprotectedvoidonNewIntent (Intentintent) {
super.onNewIntent(intent);
mReactNativePushNotificationPackage.newIntent(intent);
}
......
}

Usage

varPushNotification=require('react-native-push-notification');PushNotification.configure({// (optional) Called when Token is generated (iOS and Android)onRegister: function(token){console.log('TOKEN:',token);},// (required) Called when a remote or local notification is opened or receivedonNotification: function(notification){console.log('NOTIFICATION:',notification);},// ANDROID ONLY: (optional) GCM Sender ID.senderID: "YOUR GCM SENDER ID",// IOS ONLY (optional): default: all - Permissions to register.permissions: {alert: true,badge: true,sound: true},/** * IOS ONLY: (optional) default: true * - Specified if permissions will requested or not, * - if not, you must call PushNotificationsHandler.requestPermissions() later */requestPermissions: true,});

Handling Notifications

When any notification is opened or received the callback onNotification is called passing an object with the notification data.

Notification object example:

{foreground: false,// BOOLEAN: If the notification was received in foreground or notmessage: 'My Notification Message',// STRING: The notification messagedata: {},// OBJECT: The push data}

Local and Schedule Notifications

PushNotification.localNotification(details: Object)

PushNotification.localNotificationSchedule(details: Object) (IOS ONLY)

EXAMPLE:

PushNotification.localNotification({/* Android Only Properties */id: 0,// (optional) default: Autogenerated Unique IDtitle: "My Notification Title",// (optional)ticker: "My Notification Ticker",// (optional)largeIcon: "ic_launcher",// (optional) default: "ic_launcher"smallIcon: "ic_notification",// (optional) default: "ic_notification" with fallback for "ic_launcher"/* iOS and Android properties */message: "My Notification Message"// (required)});// IOS ONLYPushNotification.localNotificationSchedule({message: "My Notification Message"// (required)date: newDate()});

Sending Notification Data From Server

Same parameters as PushNotification.localNotification()

iOS Only Methods

PushNotification.checkPermissions(callback: Function) Check permissions

PushNotification.setApplicationIconBadgeNumber(number: number) set badge number

PushNotification.getApplicationIconBadgeNumber(callback: Function) get badge number

PushNotification.abandonPermissions() Abandon permissions

TODO

• Add PushNotification.localNotificationSchedule() Android support