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
NOTE: To use a specific play-service-gcm
version, use in your android/app/build.gradle
(change 8.1.0
for your version):
...
dependencies {
...
compile ('com.google.android.gms:play-services-gcm:8.1.0') {
force = true;
}
}
In your AndroidManifest.xml
.....
<uses-permission android:name="android.permission.WAKE_LOCK" />
<permission
android:name="${applicationId}.permission.C2D_MESSAGE"
android:protectionLevel="signature" />
<uses-permission android:name="${applicationId}.permission.C2D_MESSAGE" />
<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>
<receiver android:name="com.dieam.reactnativepushnotification.modules.RNPushNotificationPublisher" />
<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/src/main/res/values/strings.xml
<resources>
...
<string name="google_app_id" translatable="false">YOUR_GCM_SENDER_ID</string>
</resources>
In android/settings.gradle
...
include ':react-native-push-notification'
project(':react-native-push-notification').projectDir = file('../node_modules/react-native-push-notification/android')
In android/app/build.gradle
...
dependencies {
...
compile project(':react-native-push-notification')
}
Register module (in MainActivity.java
)
import android.content.Intent; // <--- Import Intent
import com.dieam.reactnativepushnotification.ReactNativePushNotificationPackage; // <--- Import Package
public class MainActivity extends Activity implements DefaultHardwareBackBtnHandler {
private ReactNativePushNotificationPackage mReactNativePushNotificationPackage; // <------ Add Package Variable
/**
* Returns the name of the main component registered from JavaScript.
* This is used to schedule rendering of the component.
*/
@Override
protected String getMainComponentName() {
return "YOUR_APP_NAME";
}
/**
* Returns whether dev mode should be enabled.
* This enables e.g. the dev menu.
*/
@Override
protected boolean getUseDeveloperSupport() {
return BuildConfig.DEBUG;
}
/**
* A list of packages used by the app. If the app uses additional views
* or modules besides the default ones, add more packages here.
*/
@Override
protected List<ReactPackage> getPackages() {
mReactNativePushNotificationPackage = new ReactNativePushNotificationPackage(this); // <------ Initialize the Package
return Arrays.<ReactPackage>asList(
new MainReactPackage(),
new VectorIconsPackage(),
new FabricPackage(),
mReactNativePushNotificationPackage // <---- Add the Package
);
}
// Add onNewIntent
@Override
// in RN <= 0.27 you may need to use `protected void onNewIntent (Intent intent) {`
public 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
},
// Should the initial notification be popped automatically
// default: true
popInitialNotification: 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)
EXAMPLE:
PushNotification.localNotification({
/* Android Only Properties */
id: 0, // (optional) default: Autogenerated Unique ID
title: "My Notification Title", // (optional)
ticker: "My Notification Ticker", // (optional)
autoCancel: true, (optional) default: true
largeIcon: "ic_launcher", // (optional) default: "ic_launcher"
smallIcon: "ic_notification", // (optional) default: "ic_notification" with fallback for "ic_launcher"
bigText: "My big text that will be shown when notification is expanded", // (optional) default: "message" prop
subText: "This is a subText", // (optional) default: none
number: 10, // (optional) default: none (Cannot be zero)
color: "red", // (optional) default: system default
/* iOS and Android properties */
message: "My Notification Message" // (required)
});
PushNotification.localNotificationSchedule({
message: "My Notification Message", // (required)
date: new Date(Date.now() + (60 * 1000)) // in 60 secs
});
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 - Restore Android local notifications after reboot