Sending and Receiving Notifications

• Sending Notifications
• Notifications on iOS
• Notifications on Android

We'll want to send a POST request to Twilio from notify.js in our server app. The request should authenticate using your Twilio Account SID and Auth Token. It should also identify who to send a notification to by either their identity or tags.

We'll use identity if we want a notification to be sent to all devices with Bindings associated with a given identity.

1
// Download the helper library from https://www.twilio.com/docs/node/install
2
const twilio = require("twilio"); // Or, for ESM: import twilio from "twilio";
3

4
// Find your Account SID and Auth Token at twilio.com/console
5
// and set the environment variables. See http://twil.io/secure
6
const accountSid = process.env.TWILIO_ACCOUNT_SID;
7
const authToken = process.env.TWILIO_AUTH_TOKEN;
8
const client = twilio(accountSid, authToken);
9

10
async function createNotification() {
11
  const notification = await client.notify.v1
12
    .services("ISXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX")
13
    .notifications.create({
14
      body: "Hello Bob",
15
      identity: ["00000001"],
16
    });
17

18
  console.log(notification.sid);
19
}
20

21
createNotification();

1
{
2
  "sid": "NTb8021351170b4e1286adaac3fdd6d082",
3
  "account_sid": "ACaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa",
4
  "service_sid": "ISXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX",
5
  "date_created": "2016-03-24T23:42:28Z",
6
  "identities": [
7
    "jing"
8
  ],
9
  "tags": [],
10
  "segments": [],
11
  "priority": "high",
12
  "ttl": 2419200,
13
  "title": "test",
14
  "body": "Hello Bob",
15
  "sound": null,
16
  "action": null,
17
  "data": null,
18
  "apn": null,
19
  "fcm": null,
20
  "gcm": null,
21
  "sms": null,
22
  "facebook_messenger": null,
23
  "alexa": null
24
}

If we want to send a notification to a particular Binding of a user, we can use identity and tags together.

1
// Download the helper library from https://www.twilio.com/docs/node/install
2
const twilio = require("twilio"); // Or, for ESM: import twilio from "twilio";
3

4
// Find your Account SID and Auth Token at twilio.com/console
5
// and set the environment variables. See http://twil.io/secure
6
const accountSid = process.env.TWILIO_ACCOUNT_SID;
7
const authToken = process.env.TWILIO_AUTH_TOKEN;
8
const client = twilio(accountSid, authToken);
9

10
async function createNotification() {
11
  const notification = await client.notify.v1
12
    .services("ISXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX")
13
    .notifications.create({
14
      body: "Hello Bob",
15
      identity: ["00000001"],
16
      tag: ["preferred_device"],
17
    });
18

19
  console.log(notification.sid);
20
}
21

22
createNotification();

1
{
2
  "sid": "NTb8021351170b4e1286adaac3fdd6d082",
3
  "account_sid": "ACaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa",
4
  "service_sid": "ISXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX",
5
  "date_created": "2016-03-24T23:42:28Z",
6
  "identities": [
7
    "jing"
8
  ],
9
  "tags": [],
10
  "segments": [],
11
  "priority": "high",
12
  "ttl": 2419200,
13
  "title": "test",
14
  "body": "Hello Bob",
15
  "sound": null,
16
  "action": null,
17
  "data": null,
18
  "apn": null,
19
  "fcm": null,
20
  "gcm": null,
21
  "sms": null,
22
  "facebook_messenger": null,
23
  "alexa": null
24
}

In this section, we will review how to receive notifications with an iOS device and go through different scenarios of receiving notifications like App in the Background, App in the Foreground or using apn payload to display a badge.

iOS has a native listener functions that fire whenever a notification is received. This happens in our AppDelegate.

1
-(void) application:(UIApplication *) application didReceiveRemoteNotification:(nonnull NSDictionary *)userInfo {
2
  NSLog(@"The notification message is: %@", [userInfo valueForKeyPath:@"aps.alert"]);
3
}

There are a number of ways we can potentially receive a notification depending on the state of our app, our device type and channel-specific payload specified in notifications. Let's take a look at some of these scenarios.

• If it's an alert notification, it will show on the home screen and in the notification center. The notification can be retrieved by parsing the launch options dictionary in application:willFinishLaunchingWithOptions: and application:didFinishLaunchingWithOptions
• If it's a silent notification, it will be delivered to application:didReceiveRemoteNotification:fetchCompletionHandler: and no alert will be raised

When your app is in the foreground, the message is not shown in the device's notification center; instead, it is delivered to your app and needs to be processed. The app may stay in foreground mode for up to 10 minutes after switching to another application.

• The application:didReceiveRemoteNotification:fetchCompletionHandler: method is called but no alert will be raised.

To send a notification to an iOS device displaying a badge, you need to use apn payload.

Expand image

Notifications resource has channel specific parameters (payload) where you can specify information on how the user should be notified of a Push Notification, including displaying a badge on the app icon. To do that, just add "badge" : X (X being the number the app icon will be badged with).

1
// Download the helper library from https://www.twilio.com/docs/node/install
2
const twilio = require("twilio"); // Or, for ESM: import twilio from "twilio";
3

4
// Find your Account SID and Auth Token at twilio.com/console
5
// and set the environment variables. See http://twil.io/secure
6
const accountSid = process.env.TWILIO_ACCOUNT_SID;
7
const authToken = process.env.TWILIO_AUTH_TOKEN;
8
const client = twilio(accountSid, authToken);
9

10
async function createNotification() {
11
  const notification = await client.notify.v1
12
    .services("ISXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX")
13
    .notifications.create({
14
      apn: {
15
        aps: {
16
          alert: {
17
            title: "Bob alert",
18
            body: "Bob, you just received a badge",
19
          },
20
          badge: 1,
21
        },
22
      },
23
      identity: ["00000001"],
24
    });
25

26
  console.log(notification.sid);
27
}
28

29
createNotification();

1
{
2
  "sid": "NTb8021351170b4e1286adaac3fdd6d082",
3
  "account_sid": "ACaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa",
4
  "service_sid": "ISXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX",
5
  "date_created": "2016-03-24T23:42:28Z",
6
  "identities": [
7
    "jing"
8
  ],
9
  "tags": [],
10
  "segments": [],
11
  "priority": "high",
12
  "ttl": 2419200,
13
  "title": "test",
14
  "body": "body",
15
  "sound": null,
16
  "action": null,
17
  "data": null,
18
  "apn": {
19
    "aps": {
20
      "alert": {
21
        "title": "Bob alert",
22
        "body": "Bob, you just received a badge"
23
      },
24
      "badge": 1
25
    }
26
  },
27
  "fcm": null,
28
  "gcm": null,
29
  "sms": null,
30
  "facebook_messenger": null,
31
  "alexa": null
32
}

Note, the device you want to send notifications to has to be registered for receiving Push notifications, including badges. See how to do that in our Registering for iOS Push Notifications guide

Now all you need to do is implement badge count, to pass on the correct badge number depending on the logic of your application.

In this section, we will review how to receive notifications with an Android device and go through different scenarios of receiving notifications like App in the Background, App in the Foreground.

Android has a native listener functions that fire whenever a notification is received. This happens in our MyFcmListenerService.

1
private static final String TAG = "MyFcmListenerService";
2
  @Override
3
  public void onMessageReceived(RemoteMessage message) {
4
    Map<String,String> data = message.getData();
5
    String body = data.get("twi_body");
6
    String title = data.get("twi_title");
7
    Log.d(TAG, "From: " + from);
8
    Log.d(TAG, "Body: " + body);
9
  }
10
}
11

The notification will arrive in JSON format and contains the message body as a String that we can then use locally.

Now let's see how notifications can be received depending on the state of your app.

• Data message (default): If there is only a data bundle then the app is woken up in the background and the onMessageReceived function is called. This is the default behavior in Notify as we map all parameters to the data bundle.

• Notification message: If there is nothing in the data section, then it's added to the notification center.
• Hybrid message: If there is a data section and a notification section, then it is added to the notification center and if the user clicks on the notification then the app is woken up and the data bundle is handed to the onMessageReceived function.

The notification is delivered to onMessageReceived of the FcmListenerService. The data key-value pairs can be found in the data bundle, but the key-value pairs of the notification bundle are not available.

To get a more in-depth look at the Notifications resources check out our REST API Guide.