Enable push notifications in a React Native app (Android)

This guide walks you through enabling push notifications in your React Native app on Android using the Acoustic Connect SDK and Firebase Cloud Messaging (FCM).

Language: TypeScript and JavaScript

Availability: Pro, Premium, and Ultimate

Requires: Connect React Native SDK version 19.0.9

Scope: Test setup for bare React Native — building, running on a connected device or emulator, and verifying push delivery. For Expo, see Enable push notifications in an Expo app (Android). For production setup, see Move your React Native integration to production.

Sample app: See our GitHub repository for a reference implementation to compare your configuration against.


Prerequisites

  • A Firebase project with your Android app registered. If you do not have one, create it at console.firebase.google.com.
  • Connect app key that supports push notifications. Push requires an app key from a Mobile app integration created after April 2026. If your integration is older, ask your Connect administrator to create a new one and provide you with the new app key. For instructions, see Connect mobile apps in the Connect user guide.
  • Connect React Native SDK version 19.0.9 integrated in your project. If you have not yet integrated the SDK, follow Integrate the Connect library into a React Native app first.

Overview

  1. Get your Firebase service account key.
  2. Share your Firebase credentials with your Connect administrator.
  3. Add google-services.json and the Google Services plugin to your Android project.
  4. Configure push in ConnectConfig.json.
  5. Add a notification icon.
  6. Add code to request notification permission from your users.

Step 1: Generate a Firebase service account key

  1. In the Firebase console, open your project.
  2. Go to Project settings > Service accounts.
  3. Click Generate new private key and confirm. Firebase downloads a .json file to your computer.

Connect uses this file to authenticate with FCM on your behalf when sending push notifications. For more information, see Initialize the SDK in non-Google environments in the Firebase documentation.


Step 2: Share Firebase credentials with your Connect administrator

Share the following with your Connect administrator so they can enable push on your Mobile app integration.

CredentialWhere to find it
Service account keyThe .json file downloaded in Step 1
Package nameYour android/app/build.gradle — the applicationId field

See Connect mobile apps in the Connect user guide.

📘

Note

Your Connect administrator needs to upload these credentials to your Mobile app integration in Connect before push notifications will be delivered. Steps 3–6 can be completed while you wait.


Step 3: Add Firebase to your Android project

Download google-services.json

  1. In the Firebase console, go to Project settings > General.
  2. Under Your apps, select your Android app.
  3. Download google-services.json and place it in android/app/.

Apply the Google Services plugin

  1. Open android/build.gradle (the project-level file) and add the Google Services plugin to the buildscript block:
buildscript {
    dependencies {
        // ... existing dependencies
        classpath 'com.google.gms:google-services:4.4.2'
    }
}
  1. Open android/app/build.gradle (the app-level file) and apply the plugin at the top of the file:
apply plugin: 'com.google.gms.google-services'
  1. Trigger a Gradle sync in Android Studio.
📘

Note

You don't need to apply the Google Services Gradle plugin or add the Firebase Messaging dependency yourself — Expo and the Connect SDK handle both automatically. For manual mode, where your app manages its own FirebaseMessagingService and forwards messages to the SDK, contact Acoustic support — manual mode is not covered in this guide.


Step 4: Configure push in ConnectConfig.json

Open ConnectConfig.json in the root of your project and add the following keys inside the Connect object:

{
  "Connect": {
    "AppKey": "YOUR_PUSH_ENABLED_APP_KEY",
    "PostMessageUrl": "YOUR_COLLECTOR_URL",
    "PushEnabled": true,
    "AndroidNotificationIconResName": "ic_notification"
  }
}
KeyValue
PushEnabledtrue — enables push support in the SDK.
AndroidNotificationIconResNameThe name of your notification icon drawable resource, without the file extension or folder path.

After saving, trigger a Gradle sync to bake the new values into the native Android configuration.


Step 5: Add a notification icon

Android requires a small monochrome icon for the notification drawer. The system applies a color tint at display time; design it as a white icon on a transparent background.

  1. In Android Studio, right-click android/app/src/main/res and select New > Image Asset.
  2. Set Icon type to Notification Icons, enter ic_notification as the name, and import your source image.
  3. Click Next > Finish. Android Studio generates the icon at the required densities under res/drawable-*.

The name you give the icon must match AndroidNotificationIconResName in ConnectConfig.json exactly.

⚠️

Warning

If AndroidNotificationIconResName is set but the drawable is missing from your project, the SDK falls back to the app launcher icon. The launcher icon is typically not optimized for the notification drawer and may appear incorrectly tinted.


Step 6: Request notification permission

On Android 13 (API 33) and later, your app must request notification permission at runtime. Call pushRequestPermission() at an appropriate moment in your app's UX — for example, after an onboarding screen that explains the value of notifications.

import AcousticConnectRN from 'react-native-acoustic-connect'

const result = await AcousticConnectRN.pushRequestPermission()

if (result.granted) {
  console.log('Notification permission granted')
} else {
  console.log('Notification permission denied:', result.error)
}

pushRequestPermission() presents the system permission dialog on Android 13+ when the state is undetermined. On Android 12 and earlier, notifications are granted by default and the method resolves immediately with { granted: true }. It always resolves and never rejects.

You can also check the current permission state without prompting:

const granted = await AcousticConnectRN.pushGetPermissionState()
// true = granted, false = denied, null = not yet determined

Testing

Testing push notifications requires a physical device or an emulator with Google Play Services — FCM does not work on AOSP emulators.

  1. Connect your device via USB and select it as the run target in Android Studio.
  2. Build and run.
  3. Grant notification permission when prompted. A new mobile contact is created in Connect and your device becomes eligible to receive pushes.
  4. Coordinate with your marketing team to send a test push to your device, or do it yourself — see Test your push notification setup.
  5. Verify the notification appears, and push signals appear in the contact's activity feed in Connect.

Message structure

After you complete the setup, your marketing team creates message content in Message composer in Connect. The following elements make up a push message, and each has its own source and constraints.

  • Notification icon — shown alongside every notification. Unlike the other elements below, it's not set in Message composer; it's always taken from the development project. See Add a notification icon above. If the drawable is missing, notifications fall back to the app launcher icon instead of your branding.
  • Title and body — authored per message; no SDK-imposed character limit, though Android may truncate long text in the notification shade depending on device and OS version.
  • Thumbnail image — shown in the collapsed notification, useful for branding. Accepted formats: .jpg, .jpeg, .png. Minimum dimensions: 64 × 64 px. Maximum size: 5 MB.
  • Expandable content — additional text or a full image shown when the user expands the notification. This is rich media delivered through FCM's data payload and is fully customizable per message, independent of the notification icon.
  • Actionable notifications — a built-in action that fires when the user taps the notification: open the app, call a number, or open a URL.

Troubleshooting

Push notifications not received

  • Confirm PushEnabled is true in ConnectConfig.json and that a Gradle sync ran after the change.
  • Confirm google-services.json is present in android/app/ and matches your Firebase project and package name.
  • Confirm the Google Services plugin is applied in both android/build.gradle and android/app/build.gradle.
  • On API 33+, confirm the user granted notification permission. Call pushGetPermissionState() to check.
  • Test on a physical device or an emulator with Google Play Services — FCM does not work on AOSP emulators.

Push signals not appearing in Connect

  • Confirm AppKey and PostMessageUrl in ConnectConfig.json match your Mobile app integration in Connect.
  • Confirm your Connect administrator has uploaded your Firebase service account key to the Mobile app integration.

Notification icon not showing correctly

  • Confirm AndroidNotificationIconResName in ConnectConfig.json matches the drawable resource name exactly (no extension, no folder path).
  • Confirm the icon is a white monochrome design on a transparent background. Colorful icons are flattened to grey by the Android system.
  • Confirm the drawable exists under res/drawable-* in your Android project.

Enabling SDK debug logging

In your android/app/build.gradle, ensure debuggable true is set in your debug build type, then inspect Logcat in Android Studio filtered by the tag Connect. When reporting an issue to support, attach your Logcat output.


Next step: Identify app users

Push setup is now complete. To make the most of push notifications, identify the people receiving them — see User identification signals in a React Native app.