...

<application android:theme="@style/AppTheme">

... <receiver android:name="com.google.android.gms.gcm.GcmReceiver" android:exported="true" android:permission="com.google.android.c2dm.permission.SEND" >

</receiver>
<service android:name="com.oney.gcm.GcmRegistrationService"/>
<service
    android:name="com.oney.gcm.RNGcmListenerService"
    android:exported="false" >
    <intent-filter>
        <action android:name="com.google.android.c2dm.intent.RECEIVE" />
    </intent-filter>
</service>
<service android:name="com.oney.gcm.RNGcmInstanceIDListenerService" android:exported="false">
    <intent-filter>
        <action android:name="com.google.android.gms.iid.InstanceID"/>
    </intent-filter>
</service>

...

### IOS Configuration
in AppDelegate.m add

import "RNGCM.h"

• (void)application:(UIApplication )application didRegisterForRemoteNotificationsWithDeviceToken:(NSData )deviceToken { NSDictionary *userInfo = @{@"deviceToken" : deviceToken}; [[NSNotificationCenter defaultCenter] postNotificationName:GCMRemoteNotificationRegistered object:self userInfo:userInfo]; }

• (void)application:(UIApplication )application didFailToRegisterForRemoteNotificationsWithError:(NSError )error { NSDictionary *userInfo = @{@"error" :error.localizedDescription}; [[NSNotificationCenter defaultCenter] postNotificationName:GCMRemoteNotificationRegistered object:self userInfo:userInfo]; }

• (void)application:(UIApplication )application didReceiveRemoteNotification:(NSDictionary )notification { [[NSNotificationCenter defaultCenter] postNotificationName: GCMRemoteNotificationReceived object:self userInfo:notification];

}

• (void)application:(UIApplication )application didReceiveRemoteNotification:(NSDictionary )notification fetchCompletionHandler:(void (^)(UIBackgroundFetchResult))handler { [[NSNotificationCenter defaultCenter] postNotificationName:GCMRemoteNotificationReceived object:self userInfo:notification]; handler(UIBackgroundFetchResultNoData); }

GCM API KEY

By following Cloud messaging, you can get google-services.json file and place it in android/app directory By following Cloud messaging, you can get googleServices-info.plist file and place it in /ios directory

Usage

'use strict';

var React = require('react'); // RN 0.25+
var {
  AppRegistry,
  View,
  DeviceEventEmitter,
} = require('react-native');

var GCM = require('react-native-gcm-push-notification');

var notification = GCM.popInitialNotification();
if (notification) {
  var info = JSON.parse(notification.info);
  Notification.create({
    subject: info.subject,
    message: info.message,
  });
  GcmAndroid.stopService();
} else {

  var {Router, Route, Schema, Animations, TabBar} = require('react-native-router-flux');
  var YourApp = React.createClass({
    componentDidMount: function() {
      GCM.addEventListener('register', function(data){
        if(!data.error){
            console.log('send gcm token to server', data.registrationToken);
        }
      });
      GCM.addEventListener('notification', function(notification){
        console.log('receive gcm notification', notification);
        var info = JSON.parse(notification.data.info);
        if (!GcmAndroid.isInForeground) {
          Notification.create({
            subject: info.subject,
            message: info.message,
          });
        }
      });

      GCM.requestPermissions();
    },
    render: function() {
      return (
        ...
      );
    }
  });

  AppRegistry.registerComponent('YourApp', () => YourApp);
}

• There are two situations.

  The app is running on the foreground or background.

  GcmAndroid.launchNotification is null, you can get notification in GcmAndroid.addEventListener('notification' listenter.

  The app is killed/closed

  GcmAndroid.launchNotification is your GCM data. You can create notification with resolving the data by using react-native-system-notification module.

• You can get info when clicking notification in DeviceEventEmitter.addListener('sysNotificationClick'. See react-native-system-notification to get more informations about how to create notification

Troubleshoot

• Do not add multiDexEnabled true in android/app/build.gradle even encounter com.android.dex.DexException: Multiple dex files... failure.
• Make sure to install Google Play service in Genymotion simulator before testing.