Firebase Mobile

Stable Version 1.0.8 (Compatible with OutSystems 11)
Other versions available for 10
Published on 26 May 2020 by 
4.8
 (23 ratings)

Firebase Mobile

Documentation

Table of contents

  • Installation
  • Push notifications

Installation

In order to install Firebase Mobile in your OutSystems app, follow the next steps:


1. Firebase project and configuration files

First of all, go to the Firebase console and create a project if you don’t have one already:


Add a new Firebase app for each mobile operating system your app supports. Since OutSystems allows us to build native apps for Android and iOS, let’s add both. When adding each Firebase app use the app identifier obtainable from Service Studio.

Add the Android app. Register the app in step 1 and download the configuration file in step 2. You can safely skip steps 3 and 4.

Store the Android configuration file (google-services.json) since we'll be using it shortly.


Add the iOS app. Register the app in step 1 and download the configuration file in step 2. Safely skip the remaining steps.

Again, store the iOS configuration file (GoogleService-Info.plist).


2. Setting up the configuration files

Now that we have both configuration files, let’s add them to your mobile app.

First of all, create a zip file containing both google-services.json and GoogleService-Info.plist.

Next, rename your zip folder google-services. Make sure it only contains both configuration files!


3. Adding the configuration files to your mobile app

Afterward, add it to the Resources tab of the mobile app in Service Studio.

Ensure that the following properties are correct:

  • Name: google-services.zip
  • Deploy action: deploy to the target directory
  • Target directory: the concatenation of your app identifier and .firebase (Deprecated since 1.0.6: the concatenation of firebase. and your app identifier)


Example of target directory:

  • App identifier: com.sample.dev.FirebaseMobileSample
  • Target directory: com.sample.dev.FirebaseMobileSample.firebase (Deprecated since 1.0.6: firebase.com.sample.dev.FirebaseMobileSample)

After this step, you’re ready to publish your application. When you open it, it’ll be registered with Firebase!



Support to multiple environments

If you’re wondering why we have to configure the “target directory” of the configuration files to include the application identifier, that’s because we need to support having Firebase in multiple environment scenarios.

Check the following example:

  • We have 3 environments (DEV, QA and PROD)
  • As expected, our app has a different app identifier in each environment
  • Also, we'll have a Firebase project per environment, which means we'll have different configuration files per environment

After configuring the Firebase projects and setting up the configuration folders for the 3 environments, we'll add them to the app Resources tab in the lowest environment, in this case DEV.

You can now safely deploy your application with Lifetime to the upper environments.

The plugin will then pick the correct folder when the app is built and apply the right Firebase configurations to your app.



Push notifications

In order to configure push notifications, follow the next steps:


1. Firebase Console configurations

To send push notifications with the Firebase's API you'll need to send a token in the request header. In order to obtain this token, access the Firebase project's console and open the Cloud Messaging settings:

  1. Head to your Firebase project's console.
  2. Click on the side menu's cogwheel, then select Project Settings.
  3. Click on the Cloud Messaging tab.
  4. Save the token correspondent to the Server key found under Project credentials


iOS additional configuration

To send notifications to iOS devices you'll need to connect our app with Apple Push Notification service (APNs) by uploading either the APNs authentication key or APNs certificates.

The configuration with APNs authentication key is recommended since it's the most current method for sending notifications in iOS. For this, you'll need your p8 file, the Key ID and the Team ID.

You can upload these files and ID's in the Cloud Messaging settings:

  1. Go to the Cloud Messaging tab in the Project Settings menu.
  2. Upload the authentication key or certificates under iOS app configuration.


2. OutSystems setup - mobile app

In your mobile app you'll need to run the plugin action InitCloudMessaging in:

  • the ApplicationReady system event (if there's already a user logged in) and


  • after the Login action.

It's also needed to run the action UnregisterDevice after logging out.


If you want to handle the push notifications while your users have their app open (in the foreground) you'll have to drag the FirebaseCloudMessaging web block to the required screens. We usually choose to put it in a Layout web block since that way we guarantee it'll be present in all screens.


3. OutSystems setup - server side

In your back-end you'll be using the action SendNotificationToUser, which requires the following inputs:

  1. FCMServerKey - the token you obtained from the Firebase Console in the first steps of this guide
  2. ApplicationId - recommended to use the value obtainable from the OutSystems action GetEntryEspaceName since that's the value used to register the devices when running the action InitCloudMessaging
  3. UserId - the user identifier of the user that'll receive the push notification
  4. Title - the title of the notification
  5. Body - the body of the notification


Remember that you can also test push notifications by using the Firebase Console or external tools, such as Postman, to call the API directly. Here is a link to a Postman collection that already has a template for sending push notifications for Android and iOS.