Skip to content

Commit

Permalink
Android background queue
Browse files Browse the repository at this point in the history
  • Loading branch information
Benjamin-Dobell committed Jul 20, 2017
1 parent 835cd86 commit ff3ae15
Show file tree
Hide file tree
Showing 5 changed files with 119 additions and 51 deletions.
84 changes: 45 additions & 39 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -210,9 +210,23 @@ NotificationsAndroid.refreshToken();

---


## Handling Received Notifications

### Background Queue _Important!_

When a push notification is received or opened and the app is not yet running, the application will automatically be launched. However, the OS notifies the application events before the JS engine is fully initialized. Hence, your listeners/callbacks aren't yet listening for events.
To ensure you don't miss any events, the application will *not* deliver any events (notifications, actions, etc.) until your application explicitly indicates it is ready to receive them. Events will be queued up until the app is ready, you indicate your application is ready to receive events by calling:

* `NotificationsIOS.consumeBackgroundQueue()`, and/or
* `NotificationsAndroid.consumeBackgroundQueue()`

Typically. you will call `consumeBackgroundQueue()` immediately after setting up your event listeners (further details below).

#### Register your listeners outside the Component hierarchy

When your applications is launched in the background in response to a push notification being received, React Native will *not* `render()` your application's view/component hierarchy; in fact, your root component won't even be initialized. To handle events in the background your listeners must therefore be installed as part of the Javascript app start-up (part of, or included from, `index.ios.js`/`index.android.js`), *not* added/removed inside Components.

### iOS

When you receive a notification, the application can be in one of the following states:
Expand All @@ -224,30 +238,29 @@ When you receive a notification, the application can be in one of the following
Example:

```javascript
constructor() {
NotificationsIOS.addEventListener('notificationReceivedForeground', this.onNotificationReceivedForeground.bind(this));
NotificationsIOS.addEventListener('notificationReceivedBackground', this.onNotificationReceivedBackground.bind(this));
NotificationsIOS.addEventListener('notificationOpened', this.onNotificationOpened.bind(this));
}
NotificationsIOS.addEventListener('notificationReceivedForeground', onNotificationReceivedForeground());
NotificationsIOS.addEventListener('notificationReceivedBackground', onNotificationReceivedBackground());
NotificationsIOS.addEventListener('notificationOpened', onNotificationOpened());

onNotificationReceivedForeground(notification) {
function onNotificationReceivedForeground(notification) {
console.log("Notification Received - Foreground", notification);
}

onNotificationReceivedBackground(notification) {
function onNotificationReceivedBackground(notification) {
console.log("Notification Received - Background", notification);
}

onNotificationOpened(notification) {
function onNotificationOpened(notification) {
console.log("Notification opened by device user", notification);
}
```

componentWillUnmount() {
// Don't forget to remove the event listeners to prevent memory leaks!
NotificationsIOS.removeEventListener('notificationReceivedForeground', this.onNotificationReceivedForeground.bind(this));
NotificationsIOS.removeEventListener('notificationReceivedBackground', this.onNotificationReceivedBackground.bind(this));
NotificationsIOS.removeEventListener('notificationOpened', this.onNotificationOpened.bind(this));
}
You can remove listeners as follows:

```
NotificationsIOS.removeEventListener('notificationReceivedForeground', onNotificationReceivedForeground);
NotificationsIOS.removeEventListener('notificationReceivedBackground', onNotificationReceivedBackground);
NotificationsIOS.removeEventListener('notificationOpened', onNotificationOpened);
```

#### Notification Object
Expand All @@ -260,17 +273,9 @@ When you receive a push notification, you'll get an instance of `IOSNotification
- **`getData()`**- returns the data payload (additional info) of the notification.
- **`getType()`**- returns `managed` for managed notifications, otherwise returns `regular`.

#### Background Queue (Important!)
When a push notification is opened but the app is not running, the application will be in a **cold launch** state, until the JS engine is up and ready to handle the notification.
The application will collect the events (notifications, actions, etc.) that happend during the cold launch for you.

When your app is ready (most of the time it's after the call to `requestPermissions()`), just call to `NotificationsIOS.consumeBackgroundQueue();` in order to consume the background queue. For more info see `index.ios.js` in the example app.
### Android

```javascript
import {NotificationsAndroid} from 'react-native-notifications';
// On Android, we allow for only one (global) listener per each event type.
NotificationsAndroid.setNotificationReceivedListener((notification) => {
console.log("Notification received on device", notification.getData());
Expand All @@ -280,6 +285,22 @@ NotificationsAndroid.setNotificationOpenedListener((notification) => {
});
```

#### Notification Object

- **`isDataOnly()`**- indicates whether the notification contains only data (`getData()`) and not other notification properties.
- **`getData()`**- content of the `data` section of the original message (sent to Firebase's servers).
- **`getTitle()`**- the notification's title.
- **`getBody()`/`getMessage()`**- the notification's body.
- **`getIcon()`**- the notification's icon (the name of a Android _drawable_ bundled with your app).
- **`getSound()`**- the notification's sound (the name of a native Android sound asset bundled with your app).
- **`getTag()`**- an identifier for this notification. If two notifications are posted (locally or remotely) with the same _tag_ AND `id` (_not_ part of the notification's properties) the latter notification will replace/update the former.
- **`getColor()`**- a `#rrggbb` formatted color that will be used to tint your app icon and name in the system notification tray/drawer.
- **`getLargeIcon()`**- a larger icon (typically displayed on the right) of your notification. This can be specified as a **URL** (local or online), or as the name of an Android _drawable_ bundled in your app.
- **`getLightsColor()`**- a `#rrggbb` formatted color that will set the color of the flashing notification LED on device's that have one. Typically this will only light-up if the device's screen is off when the notification is received.
- **`getLightsOnMs()`**- how many milliseconds the notification LED should stay lit whilst flashing.
- **`getLightsOffMs()`**- how many milliseconds the notification LED should stay unlit between flashes.
---

#### Receiving Notifications in the Background

On Android there are a very specific set of rules regarding when when and _if_ notifications are delivered to your application.
Expand All @@ -301,22 +322,7 @@ These automatic background notifications have several limited functionality:

> If you want fine-grained control over your application it's suggested you send "data-only" notifications, and use this data to generate a local notification with `NotificationsAndroid.localNotification()`.
#### Notification Object
- **`isDataOnly()`**- indicates whether the notification contains only data (`getData()`) and not other notification properties.
- **`getData()`**- content of the `data` section of the original message (sent to Firebase's servers).
- **`getTitle()`**- the notification's title.
- **`getBody()`/`getMessage()`**- the notification's body.
- **`getIcon()`**- the notification's icon (the name of a Android _drawable_ bundled with your app).
- **`getSound()`**- the notification's sound (the name of a native Android sound asset bundled with your app).
- **`getTag()`**- an identifier for this notification. If two notifications are posted (locally or remotely) with the same _tag_ AND `id` (_not_ part of the notification's properties) the latter notification will replace/update the former.
- **`getColor()`**- a `#rrggbb` formatted color that will be used to tint your app icon and name in the system notification tray/drawer.
- **`getLargeIcon()`**- a larger icon (typically displayed on the right) of your notification. This can be specified as a **URL** (local or online), or as the name of an Android _drawable_ bundled in your app.
- **`getLightsColor()`**- a `#rrggbb` formatted color that will set the color of the flashing notification LED on device's that have one. Typically this will only light-up if the device's screen is off when the notification is received.
- **`getLightsOnMs()`**- how many milliseconds the notification LED should stay lit whilst flashing.
- **`getLightsOffMs()`**- how many milliseconds the notification LED should stay unlit between flashes.
---

## Querying initial notification
## Querying Initial Notification
React-Native's [`PushNotificationsIOS.getInitialNotification()`](https://facebook.github.io/react-native/docs/pushnotificationios.html#getinitialnotification) allows for the async retrieval of the original notification used to open the App on iOS, but it has no equivalent implementation for Android.

Expand Down
2 changes: 1 addition & 1 deletion android/src/main/AndroidManifest.xml
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,7 @@
<!--
A proxy-service that gives the library an opportunity to do some work before launching/resuming the actual application task.
-->
<service android:name=".core.ProxyService"/>
<service android:name=".core.LocalNotificationService"/>

<!-- Dispatched by the GcmReceiver when messages are received. -->
<service
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -17,6 +17,7 @@
import com.wix.reactnativenotifications.core.AppLifecycleFacade;
import com.wix.reactnativenotifications.core.AppLifecycleFacadeHolder;
import com.wix.reactnativenotifications.core.InitialNotificationHolder;
import com.wix.reactnativenotifications.core.JsIOHelper;
import com.wix.reactnativenotifications.core.ReactAppLifecycleFacade;
import com.wix.reactnativenotifications.core.notificationdrawer.INotificationDrawer;
import com.wix.reactnativenotifications.core.notificationdrawer.NotificationDrawer;
Expand Down Expand Up @@ -101,6 +102,12 @@ public void cancelAllLocalNotifications() {
notificationDrawer.onCancelAllLocalNotifications();
}

@ReactMethod
public void consumeBackgroundQueue() {
final JsIOHelper jsIOHelper = new JsIOHelper(getReactApplicationContext().getApplicationContext());
jsIOHelper.consumeBackgroundQueue();
}

@Override
public void onAppVisible() {
final INotificationDrawer notificationsDrawer = NotificationDrawer.get(getReactApplicationContext().getApplicationContext());
Expand Down
Original file line number Diff line number Diff line change
@@ -1,38 +1,89 @@
package com.wix.reactnativenotifications.core;

import android.content.Context;
import android.content.Intent;
import android.os.Bundle;
import android.os.Handler;
import android.os.Looper;

import com.facebook.react.ReactApplication;
import com.facebook.react.ReactInstanceManager;
import com.facebook.react.ReactNativeHost;
import com.facebook.react.bridge.Arguments;
import com.facebook.react.bridge.ReactContext;
import com.facebook.react.bridge.WritableMap;
import com.facebook.react.modules.core.DeviceEventManagerModule;

import java.util.LinkedList;

public class JsIOHelper {

private static final LinkedList<Event> sBackgroundQueue = new LinkedList<Event>();
private static boolean sJsIsReady = false;

private final Context mContext;
private final Handler mHandler = new Handler(Looper.getMainLooper());

public JsIOHelper(Context context) {
mContext = context;
}

public boolean sendEventToJS(String eventName, Bundle bundle) {
return sendEventToJS(eventName, Arguments.fromBundle(bundle));
public void sendEventToJS(String name, Bundle bundle) {
final Event event = new Event(name, Arguments.fromBundle(bundle));
postEvent(event);
}

public boolean sendEventToJS(String eventName, String string) {
return sendEventToJS(eventName, (Object) string);
public void sendEventToJS(String name, String string) {
final Event event = new Event(name, string);
postEvent(event);
}

boolean sendEventToJS(String eventName, Object object) {
final ReactContext reactContext = ((ReactApplication) mContext.getApplicationContext()).getReactNativeHost().getReactInstanceManager().getCurrentReactContext();
public void consumeBackgroundQueue() {
synchronized (JsIOHelper.class) {
sJsIsReady = true;

if (reactContext != null && reactContext.hasActiveCatalystInstance()) {
reactContext.getJSModule(DeviceEventManagerModule.RCTDeviceEventEmitter.class).emit(eventName, object);
return true;
while (!sBackgroundQueue.isEmpty()) {
emitEvent(sBackgroundQueue.pop());
}
}
}

private void postEvent(final Event event) {
if (Looper.getMainLooper() == Looper.myLooper()) {
emitEvent(event);
} else {
mHandler.post(new Runnable() {
@Override
public void run() {
emitEvent(event);
}
});
}
}

private void emitEvent(Event event) {
final ReactInstanceManager reactInstanceManager = ((ReactApplication) mContext.getApplicationContext()).getReactNativeHost().getReactInstanceManager();
final ReactContext reactContext = reactInstanceManager.getCurrentReactContext();

return false;
synchronized (JsIOHelper.class) {
if (sJsIsReady && reactContext != null && reactContext.hasActiveCatalystInstance()) {
reactContext.getJSModule(DeviceEventManagerModule.RCTDeviceEventEmitter.class).emit(event.name, event.object);
} else {
sBackgroundQueue.push(event);

if (reactContext == null && !reactInstanceManager.hasStartedCreatingInitialContext()) {
reactInstanceManager.createReactContextInBackground();
}
}
}
}

private static final class Event {
final String name;
final Object object;

Event(String name, Object object) {
this.name = name;
this.object = object;
}
}
}
4 changes: 4 additions & 0 deletions index.android.js
Original file line number Diff line number Diff line change
Expand Up @@ -79,4 +79,8 @@ export class NotificationsAndroid {
return rawNotification ? new NotificationAndroid(rawNotification) : undefined;
});
}

static consumeBackgroundQueue() {
RNNotifications.consumeBackgroundQueue();
}
}

0 comments on commit ff3ae15

Please sign in to comment.