React Native Local and Remote Notifications for iOS and Android
npm install react-native-push-notification
The component uses PushNotificationIOS for the iOS part.
Please see: PushNotificationIOS
In your AndroidManifest.xml
.....
<permission
android:name="${applicationId}.permission.C2D_MESSAGE"
android:protectionLevel="signature" />
<uses-permission android:name="${applicationId}.permission.C2D_MESSAGE" />
<uses-permission android:name="android.permission.WAKE_LOCK" />
<uses-permission android:name="android.permission.VIBRATE" />
<application ....>
<receiver
android:name="com.google.android.gms.gcm.GcmReceiver"
android:exported="true"
android:permission="com.google.android.c2dm.permission.SEND" >
<intent-filter>
<action android:name="com.google.android.c2dm.intent.RECEIVE" />
<category android:name="${applicationId}" />
</intent-filter>
</receiver>
<service android:name="com.dieam.reactnativepushnotification.modules.RNPushNotificationRegistrationService"/>
<service
android:name="com.dieam.reactnativepushnotification.modules.RNPushNotificationListenerService"
android:exported="false" >
<intent-filter>
<action android: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)
import com.dieam.reactnativepushnotification.ReactNativePushNotificationPackage; // <--- Import
public class MainActivity extends Activity implements DefaultHardwareBackBtnHandler {
......
private ReactInstanceManager mReactInstanceManager;
private ReactRootView mReactRootView;
private ReactNativePushNotificationPackage mReactNativePushNotificationPackage; // <------ Add Package Variable
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
mReactRootView = new ReactRootView(this);
mReactNativePushNotificationPackage = new ReactNativePushNotificationPackage(this); // <------ Initialize the Package
mReactInstanceManager = ReactInstanceManager.builder()
.setApplication(getApplication())
.setBundleAssetName("index.android.bundle")
.setJSMainModuleName("index.android")
.addPackage(new MainReactPackage())
.addPackage(mReactNativePushNotificationPackage) // <------ Add the Package
.setUseDeveloperSupport(BuildConfig.DEBUG)
.setInitialLifecycleState(LifecycleState.RESUMED)
.build();
mReactRootView.startReactApplication(mReactInstanceManager, "ExampleApp", null);
setContentView(mReactRootView);
}
// Add onNewIntent
@Override
protected void onNewIntent (Intent intent) {
super.onNewIntent(intent);
mReactNativePushNotificationPackage.newIntent(intent);
}
......
}var PushNotification = 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 received
onNotification: 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,
});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 not
message: 'My Notification Message', // STRING: The notification message
data: {}, // OBJECT: The push data
}PushNotification.localNotification(details: Object)
PushNotification.localNotificationSchedule(details: Object) (IOS ONLY)
EXAMPLE:
PushNotification.localNotification({
/* Android Only Properties */
id: 0, // (optional) default: Autogenerated Unique ID
title: "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 ONLY
PushNotification.localNotificationSchedule({
message: "My Notification Message" // (required)
date: new Date()
});Same parameters as PushNotification.localNotification()
PushNotification.checkPermissions(callback: Function) Check permissions
PushNotification.setApplicationIconBadgeNumber(number: number) set badge number
PushNotification.getApplicationIconBadgeNumber(callback: Function) get badge number
PushNotification.abandonPermissions() Abandon permissions
- Add
PushNotification.localNotificationSchedule()Android support