React-native-push-notification: Clicking on local notification - onNotification doesn't get called when app is not started (Android)

Created on 10 Aug 2017  路  5Comments  路  Source: zo0r/react-native-push-notification

"react": "16.0.0-alpha.12",
"react-native": "^0.45.1",
"react-native-push-notification": "^3.0.0"

On application start I have this code:

PushNotification.configure({
    onNotification: function(notification) {
        console.log('onNotification');
        ToastAndroid.show('onNotification', 3000);
    }
});

My background service sends local push notification:

PushNotification.localNotification({
    message: 'Hello World',
    smallIcon: 'ic_launcher'
});

The notification gets delivered. When I click it, onNotification method doesn't get called, then when I receive another notification, it actually gets called. It seems like it works only if app is in memory atm.

Am I doing something wrong?

stackoverflow question here.

Most helpful comment

For people who still haven't figured this out, here is what solved it in my case:

In my reducers.js file

import configurePushNotification from './pushController'

export default function configureStore() {
    var store = createStore(allReducers, applyMiddleware(
        thunkMiddleware
    ))
    configurePushNotification(store.dispatch, store.getState)
    return store
}

In my pushController.js file

import PushNotification from 'react-native-push-notification';
import {
    AppState
} from 'react-native'

const onNotification = (notification) => {
    if (notification.userInteraction) { console.log('User clicked notification') }
    else { console.log('User received notification') }
}

export default (dispatch, getState) => {
    PushNotification.configure({
        onRegister: function(token) {
            console.log('Generate push token:', token);
        },
        onNotification: onNotification,
        senderID: XXXXXX,
    });
}

// The magic happens here
const appStateListener = (state) => {
    if (state === 'active') {
        PushNotification.popInitialNotification(notification => {
            if (notification) {
                onNotification(notification)
            }
        });
    }
};

AppState.addEventListener('change', appStateListener);

All 5 comments

In my code I configured notifications outside App class - that was an issue. I just moved the configuration to App constructor and now it works just fine, onNotification gets called with no problem:

class App extends React.Component {
    constructor(props) {
        super(props);
        PushNotification.configure({ ... });
    }
}

@nonsense66 Hi! I can't get it to work.. This is how I have it.

App.js

class App extends Component {
  constructor () {
    super()

    PushConfig.configure(store.dispatch)
  }

PushConfig.js

import PushNotification from 'react-native-push-notification'
import NotificationActions from '../Redux/NotificationRedux'
import PNHelper from '../Lib/PushNotificationHelpers'

export default {
  // dispatch is passed in from App.js after creating store
  configure: dispatch => {
    // https://github.com/zo0r/react-native-push-notification
    PushNotification.configure({
      // (optional) Called when Token is generated (iOS and Android)
      onRegister: token => {
        console.tron.display({ name: 'Notification register', preview: token })
      },

      // (required) Called when a remote or local notification is opened or received
      onNotification: notification => {
        console.tron.display({
          name: 'Notification',
          preview: 'Notification clicked',
          value: { notification }
        })
        // PNHelper.cancelReminder(
        //   'abc123',
        //   NotificationActions.removeInspectionReminder('abc123')
        // )
        // dispatch(NotificationActions.removeInspectionReminder(notification.message))
      },

      // 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
      // Leave this off unless you have good reason.
      popInitialNotification: false,

      /**
      * IOS ONLY: (optional) default: true
      * - Specified if permissions will requested or not,
      * - if not, you must call PushNotificationsHandler.requestPermissions() later
      * This example app shows how to best call requestPermissions() later.
      */
      requestPermissions: true
    })
  }
}

Nothing is different, the onNotification is nevered triggered without pressing/clicking the notification.

I have the same problem!

For people who still haven't figured this out, here is what solved it in my case:

In my reducers.js file

import configurePushNotification from './pushController'

export default function configureStore() {
    var store = createStore(allReducers, applyMiddleware(
        thunkMiddleware
    ))
    configurePushNotification(store.dispatch, store.getState)
    return store
}

In my pushController.js file

import PushNotification from 'react-native-push-notification';
import {
    AppState
} from 'react-native'

const onNotification = (notification) => {
    if (notification.userInteraction) { console.log('User clicked notification') }
    else { console.log('User received notification') }
}

export default (dispatch, getState) => {
    PushNotification.configure({
        onRegister: function(token) {
            console.log('Generate push token:', token);
        },
        onNotification: onNotification,
        senderID: XXXXXX,
    });
}

// The magic happens here
const appStateListener = (state) => {
    if (state === 'active') {
        PushNotification.popInitialNotification(notification => {
            if (notification) {
                onNotification(notification)
            }
        });
    }
};

AppState.addEventListener('change', appStateListener);

@anubhav193 that should be in the documentation, thanks!

Was this page helpful?
0 / 5 - 0 ratings

Related issues

selimonline picture selimonline  路  3Comments

Kiran0791 picture Kiran0791  路  3Comments

ssolida picture ssolida  路  3Comments

sungjinoh picture sungjinoh  路  3Comments

atteia picture atteia  路  4Comments