Firebase Cloud Messaging integration

1. Add Firebase to your project

Follow the instructions for Adding Firebase to Your Android Project. If you follow the manual integration process from these instructions, make sure that you follow both steps for Adding Firebase to your app and Adding the SDK.

2. Add Firebase Cloud Messaging dependency

Add the dependency for Firebase Cloud Messaging in your module’s build.gradle.

dependencies {
  implementation 'com.google.firebase:firebase-messaging:17.3.2'
}

3. Pass Firebase token to WebEngage

Firebase tokens can be passed to WebEngage using FirebaseMessagingService

import com.google.firebase.messaging.FirebaseMessagingService;
import com.webengage.sdk.android.WebEngage;

public class MyFirebaseMessagingService extends FirebaseMessagingService {
    @Override
    public void onNewToken(String s) {
        super.onNewToken(s);
        WebEngage.get().setRegistrationID(s);
    }
}

It is also recommended that you pass Firebase token to WebEngage from onCreate of your Application class as shown below. This will ensure that changes in user’s Firebase token are communicated to WebEngage.

import com.google.android.gms.tasks.OnSuccessListener;
import com.google.firebase.iid.FirebaseInstanceId;
import com.google.firebase.iid.InstanceIdResult;
import com.webengage.sdk.android.WebEngage;

public class MyApplication extends Application {
    @Override
    public void onCreate() {
        super.onCreate();
    
        FirebaseInstanceId.getInstance().getInstanceId().addOnSuccessListener(new OnSuccessListener<InstanceIdResult>() {
            @Override
            public void onSuccess(InstanceIdResult instanceIdResult) {
                String token = instanceIdResult.getToken();
                WebEngage.get().setRegistrationID(token);
            }
        });
    }
}

4. Pass messages to WebEngage

Create a class that extends FirebaseMessagingService and pass messages to WebEngage.
All incoming messages from WebEngage will contain key source with the value as webengage.

package your.application.package;

import com.google.firebase.messaging.FirebaseMessagingService;
import com.google.firebase.messaging.RemoteMessage;
import com.webengage.sdk.android.WebEngage;

public class MyFirebaseMessagingService extends FirebaseMessagingService {
  @Override
  public void onMessageReceived(RemoteMessage remoteMessage) {
    Map<String, String> data = remoteMessage.getData();
    if(data != null) {
      if(data.containsKey("source") && "webengage".equals(data.get("source"))) {
        WebEngage.get().receive(data);
      }
    }
  }
}

Next, register the service to the application element of your AndroidManifest.xml as follows.

<service
    android:name=".MyFirebaseMessagingService">
    <intent-filter>
        <action android:name="com.google.firebase.MESSAGING_EVENT"/>
    </intent-filter>
</service>

5. Add your Firebase credentials to WebEngage

  1. Log in to the Firebase Developers Console.
  2. Select your Firebase project.
  3. Navigate to Project Settings > Cloud Messaging and copy your server key as shown in the image below.
  1. Log in to your WebEngage dashboard and navigate to Integrations > Channels. Select Push tab and paste the copied server key under the field labeled “GCM/FCM Server Key” under Android section. Enter your application package name under the field labeled “Package Name” and click Save.

Next steps

1. Customizing icon and accent colors

By default, WebEngage Android SDK uses your application's icon to set the small and large icons of your push messages. You can provide custom icons during SDK initialization as shown below.

import com.webengage.sdk.android.WebEngageConfig;
import com.webengage.sdk.android.WebEngageActivityLifeCycleCallbacks;

...
...

WebEngageConfig webEngageConfig = new WebEngageConfig.Builder()
	.setPushSmallIcon(R.drawable.YOUR_SMALL_ICON)
	.setPushLargeIcon(R.drawable.YOUR_LARGE_ICON)
	.setPushAccentColor(Color.parseColor("#ff0000"))
	.build();
registerActivityLifecycleCallbacks(new WebEngageActivityLifeCycleCallbacks(this, webEngageConfig));

This will work only for SDK version 1.14.0 and above.

2. Notification icon fix for Android Lollipop and above

Since the release of Lollipop (API 21), the material design style dictates that all non-alpha channels in notification icons be ignored. Therefore, the small notification icon will be rendered solid white if it is not transparent.

Hence, if you have provided a custom small icon during SDK initialisation as shown above, then you need to make sure that it is transparent.


So, what's next?

Notification channels

Firebase Cloud Messaging integration


Suggested Edits are limited on API Reference Pages

You can only suggest edits to Markdown body content, but not to the API spec.