Push notifications
  • 30 May 2022
  • 4 Minutes to read
  • Dark
    Light
  • PDF

Push notifications

  • Dark
    Light
  • PDF

About push notifications

A push notification is a message that is "pushed" from a backend server to your app, appearing instantly on your target user's device whether it has the app launched or not.

Typically, a push message is shown on the mobile device lock screen/notification center if the app is closed. If the app is running when the push notification is received, an event is triggered and the developer can then decide how the app should react.

Android

On Android, Composer uses Google's Firebase cloud messaging under the hood.

Setting up Firebase

After registering for Firebase you need to create a new project and on that project you need to add an Android app. You need to provide the same exact Android package name as you've configured in your Composer's build service configuration (and Google Play Store, if publishing through that channel).

pasted-graphic

After filling out the form, you need to download the provided config file:

google-services.json

Download config file Android

Composer app

On your Composer app, you need logic to get a device token for push messages. The device token is then sent to your backend and used to uniquely identify a specific device (or devices) as the recipient for the message.

First, we need to request notification permissions, which can be done with the flow function Request notification permissions.

Next, we need to get the device token with the flow function Get device token (beta) , found in its current pre-release state by copypasting the share token xK87GpQfQY_7D3obIAeswQ into the marketplace search box.

Example of notification permissions and get device token flow

The device token returned by the flow function can then be posted to your backend via a HTTP request node (probably along with some identifying user information to correctly target the notifications).

Build settings

After you've done the basic build configurations for Android, you need to access the Advanced tab. Under this tab you need to upload your google-services.json you downloaded earlier from Firebase. This file is injected in your build and setups your app for receiving push notifications.

Note that the Advanced tab only becomes visible when you have flow functions in your app which require additional files or values that need to be provided for the build to be successful, so in this case Get device token requires google-services.json.

Save reminder

Backend

We don't go into too much detail about the backend setup but first you need to retrieve your Server key from Firebase. Naviagte to Project Overview > Settings > Cloud Messaging.

Server key

And when you have a registered device token and your server key you can post a message through Firebase which will land on your device. This would be done by your custom backend server, but a curl example would be:

curl --location --request POST 'https://fcm.googleapis.com/fcm/send' \
--header 'Content-Type: application/json' \
--header 'Authorization: key=<MyFirebaseServerKey>' \
--data-raw '{
    "to": "<Device Token user sent you from his app>",
    "notification": {
        "sound": "default",
        "body": "test message",
        "content_available": true,
        "title": "BÄTÄNG"   
        },
    "data": {
        "sound": "default",
        "body": "test message",
        "content_available": true,
        "title": "BÄTÄNG"
    }
}'

That's it – your app should now receive the push notification successfully!

Android force quit

Using Android's 'Force quit' feature will cut off the connection between your app and Firebase, and lead to being unable to receive any notifications unless the application is re-launched again.

iOS

On iOS we use Apple Push Notification service (APNS) for push notification delivery.

Prerequisites

For starters your app must match these requirements:

  • Push Notifications must be enabled on your App ID.
  • Your Distribution Certificates must have been built after Push Notifications was enabled.
  • Your Provisioning Profiles must have been built after Push Notifications were enabled.

To enable push notifications, you need to add it from the "Capabilities" list while creating a new App Identifier OR modifying an existing one. There you will be prompted to add create your APNS certificate.

APNS Cert

Note: You can also add APNS SSL Certificate later at https://developer.apple.com/account/resources/certificates/add but you need to create a new distribution certificate/provisioning profile that includes this in the App identifier.

Composer app

On your Composer app, you need logic to get a device token for push messages. The device token is then sent to your backend and used to uniquely identify a specific device (or devices) as the recipient for the message.

First, we need to request notification permissions, which can be done with the flow function Request notification permissions.

Next, we need to get the device token with the flow function Get device token (beta) , found in its current pre-release state by copypasting the share token xK87GpQfQY_7D3obIAeswQ into the marketplace search box.

Example of notification permissions and get device token flow

The device token returned by the flow function can then be posted to your backend via a HTTP request node (probably along with some identifying user information to correctly target the notifications).

Backend

There's again various ways to achieve a functioning backend which is not delved in too deeply.

As an example you can export your push certificate as an .pem file and use it in curl to successfully send a push notification.

curl --location --request POST 'https://api.push.apple.com/3/device/<device token provided by the Get device token flow function >' \
--header 'apns-topic: <bundle id>' \
--http2 \
--cert '<route to my .pem file>' \
--data-raw '  { "aps" : { "alert" : "Here's Johnny!" } }
'

Was this article helpful?

What's Next