Push Notifications with Titanium and Firebase

Kaumadie Chamalka
6 min readMar 31, 2019

In this blog, I want you to give a basic knowledge on how to implement push notification with appcelerator titanium and firebase. Firebase is a platform that offers various services for mobile and web applications that helps developers to build apps quickly with a lot of features.To send the notifications, we will use the service called Cloud Messaging, which allows us to send messages to any device using HTTP requests.

To send push notifications, Appcelerator Mobile Backend Services rely on the Google Cloud Messaging (GCM) or Firebase Cloud Messaging for Android applications, and the Apple Push Notification (APN) service for iOS applications. Firebase Cloud Messaging (FCM) is the new version of GCM. To use these services in your Titanium application, you first need to enable either FCM or GCM or APN for your application, and then configure Mobile Backend Services with information about your push service. This guide walks you through the process of creating and configuring push services for your application.

How to setup Project for send and received push notifications,

Setup Titanium Studio,

  1. Open Titanium Studio.
  2. Create new project — At the top of the screen click on File > New > Mobile App Project > Alloy > Default Alloy Project then click next.
  • When creating a new application in Appcelerator Studio, make sure the Enable Appcelerator Services checkbox is enabled.
  • For a previously created project, open your tiapp.xml file, then click the Enable Services button under the Appcelerator Service section.

Update manifest

Merge the following keys to the <android> section of the tiapp.xml in order to use Google Cloud Messaging (GCM).

Setup Firebase,

First of all, you need to have a Firebase account and you’ll need to create a new project within it.

How to create firebase account and project :

https://help.appsheet.com/manage/white-label-native-apps/creating-a-firebase-account

Then select your project and go to Project settings > click Add Firebase to your Android app > enter Android package name > tap Register app button > download the google-services.json file.

Note : follow similar steps for Add Firebase to iOS app and download GoogleService-Info.plist file.

Requirements for implement push notification for your alloy project,

  1. Android: Download the google-services.json from your project and copy it to Resources (classic) or app/assets/android (Alloy)

2. iOS: Download the GoogleService-Info.plist and copy it to Resources (classic) or app/assets/iphone (Alloy)

3. Download the core-module titanium-firebase-core

4. Download the Cloud Messaging titanium-firebase-cloud-messaging

5. iOS: Titanium SDK 6.3.0+

6. Android: Titanium SDK 7.0.0+ and Ti.PlayServices

Note: how to add modules to your project, will describe bellow section in the blog.

For a push notification to reach the user, the user (or device) must be subscribed to receive push notifications on one or more notification channels. The application must also obtain a device token, which permits Mobile Backend Services to communicate with the push service provider (Google Cloud Messaging, Firebase Cloud Messaging, or Apple Push Notification). This guide explains how to obtain a device token, and how to use the Push Notifications API to manage your user’s notification subscriptions.

Obtaining a device token

Need of a device token,

When sending a push notification, the server uses tokens as “addresses” to deliver to the correct devices. In your app, you would now send this token to your server, so that it could be saved and later used for sending notifications

To receive push notifications, your application first needs to obtain a device token. To obtain a device token:

  • On Android, call the CloudPush module’s retrieveDeviceToken() method or firebase.cloudmessaging module’s registerForPushNotifications() method
  • On iOS, call the Titanium.Network.registerForPushNotifications()

Once your application has obtained a device token it should save it for later use.

Obtaining a device token on Android

To obtain a device token from GCM or FCM, first you need to add the CloudPush module to your project. This module is included with the Titanium SDK, but is not included by default in new projects.

To add the CloudPush module to your project:

  • In Studio, open your project’s tiapp.xml file.
  • In the Modules section, click the add (+) button.
  • Select ti.cloudpush and click OK.

Note : similarly add other modules to implement push notification.

Modules : ti.cloudpush, ti.cloud, ti.playservices

To add the downloaded modules to your project:

Downloaded Modules : firebase.cloudmessaging, firebase.core

  1. Extracted the downloaded zip files.
  2. Put the modules folder in the root of your application. So on same level as tiapp.xml

3. Double-click on the tiapp.xml file.

4. In the right-hand column, click the + to add a new module. It will show you a list of modules available in your global directory and in your project.

5. Select modules (firebase.cloudmessaging, firebase.core) and click ok.

Setup Appcelerator cloud console,

Configuring push services for Android devices,

Once you’ve created a Google API project with FCM or GCM enabled, you need to update your application’s settings page in Dashboard with the API key and sender ID you generated.

Getting start with appcelerator Dashboard : https://docs.appcelerator.com/platform/latest/#!/guide/Appcelerator_Dashboard_Getting_Started-section-src-53873222_AppceleratorDashboardGettingStarted-Learn

To configure API Builder for push notifications using Dashboard:

  1. Open Dashboard and select your application.
  2. Click Push Notifications on the left-side navigation.

3. Select the Android tab.

4. Enter the server key in the Server Key field and the sender ID in the Sender ID field. To find your Server Key and Sender ID, go to Firebase. From there, click on Settings (cog) > Cloud Messaging. This page will show your Sender ID (should be the same as your project number) and your Server Key.

5. Click Save Changes.

Configuring push services for iOS devices,

To enable Apple Push Notification service for your application, you need to create an Apple Push Notification certificate and upload the certificate to the MBS server. Note that iOS simulators cannot receive Apple push notifications. Use Dashboard to upload the .p12 certificate file to API Builder and enable notifications within your application.

To upload the certificate using Dashboard:

  1. Open Dashboard and select your MBS application from the Apps drop-down menu.
  2. Select Push Notifications on the left-side navigation.
  3. Select the iOS tab.
  4. Click Choose File, locate the .p12 file you exported previously, and click Open.
  5. In the Certificate Password field enter the password you selected when you generated the certificate.

6. Click Save Changes. If the password you entered was incorrect, an error dialog will alert you.

To read more about ios certificates follow this link : http://www.stencyl.com/help/view/ios-certificates-guide

Receive FCM messages with Appcelerator

Call registerFirebase function for register for push notification with firebase.

Send FCM messages with PHP

--

--

Kaumadie Chamalka

Associate Technical Lead at One Billion Tech (Pvt) Ltd. | Graduate in Computer Science, University of Ruhuna.