Skip to main content
Firebase Cloud Messaging (FCM) is Google’s service for sending push notifications to Android, iOS, and web clients. The Firebase Cloud Messaging connector lets your Lovable app send those notifications through your own Firebase project. It is designed for apps that need to reach people outside the browser tab: order updates, announcements, and reminders. Firebase Cloud Messaging is available as an app + chat connector: one shared connection that works in the chat while you build and in your published apps. With Firebase Cloud Messaging, your app can:
  • Send a notification to one device using a registration token
  • Broadcast to a topic that devices have already subscribed to
  • Include a small data payload with each message (string values only)
  • Optionally configure browser push so people using your web app can opt in and receive notifications
It is a good fit for order tracking, ops alerts, and any workflow where the app already stores device tokens or uses FCM topics. The connector sends messages. It does not register devices or report whether a notification was opened.

​
Common use cases and example apps

These examples show what you can build with Firebase Cloud Messaging, each with a prompt to start from.

​
How to connect Firebase Cloud Messaging

Who can create Firebase Cloud Messaging connections depends on your plan and workspace settings. App + chat connectors are available by default on Free, Pro, and Business plans. On Enterprise plans, they are effectively disabled at first: Who can create connections and clients defaults to No one until an admin changes it in Connectors → Admin settings → App + chat connectors. You can create multiple Firebase Cloud Messaging connections using different Firebase projects, which is useful for separating development and production. When the connection is created, you can link it to the projects where you want to use it. Anyone building in a project can ask Lovable in chat to link their project to it.

​
Prerequisites

Before connecting Firebase Cloud Messaging, make sure you have:
  • A Firebase project
  • A Google Cloud service account in that project with the Firebase Cloud Messaging API Admin role
  • Permission to create connections in your Lovable workspace (see Who can create connections and clients)
  • If you want browser push: a Firebase web app in the same project, plus a Web Push certificate (VAPID key)
Sends through this connector use your Firebase and Google Cloud project. Quotas and any Google Cloud billing are handled by Google, not Lovable.

​
Step 1: Get a Firebase service account key

Your Lovable app never sees this JSON. Lovable stores it on the connection and exchanges it for a short-lived Google token when sending. To generate a service account key:
1

Open your Firebase project

Sign in to the Firebase console and open the project you want Lovable to send from.
2

Open service accounts

Go to Project settings → Service accounts. You can also open Generate service account key and pick the project when Firebase asks.
3

Generate a private key

Click Generate new private key and confirm. Firebase downloads a JSON file. Use a key from a service account that has the Firebase Cloud Messaging API Admin role.
4

Store the file securely

Keep the JSON file private. You upload it in the next step. Do not paste it into chat, commit it to git, or put it in frontend code.
The service account JSON functions like a password. Anyone with the file can send as your Firebase project. Rotate it in Google Cloud and update the Lovable connection if it leaks.
See Google’s documentation for more: Firebase Cloud Messaging and service accounts.

​
Step 2: Connect Firebase Cloud Messaging to Lovable

You can create multiple connections using different Firebase projects.
1

Open Firebase Cloud Messaging in Connectors

Open Connectors and select Firebase Cloud Messaging. For the other places to open the catalog from, see Where to find connectors.
2

Add a connection

Click Add connection.
3

Configure the connection

Fill in the connection form:
  1. Display name: name the connection, for example FCM Prod.
  2. Service Account JSON: upload the JSON key you downloaded from Firebase.
  3. Client setup: choose Server or native only (default) if you only send to tokens you already have, including Android and iOS. Choose Include web push if the app also registers browsers for notifications.
4

Add web push fields if you selected Include web push

These fields appear only when Client setup is Include web push. All three are required in that mode. Lovable derives the Firebase project ID from the service account, so you do not enter it.
  1. Firebase API key: the apiKey value from your Firebase web app config (starts with AIza). In Firebase, open Project settings → General → Your apps, select the web app, and copy it from the SDK snippet.
  2. Firebase App ID: the appId value from the same snippet (format 1:<numbers>:web:<hex>).
  3. Web Push VAPID key: the public Web Push certificate. In Firebase, open Project settings → Cloud Messaging → Web Push certificates, or use View Web Push certificates. Copy the key pair’s public key.
Skip this step if you chose Server or native only.
5

Choose who can use this connection

Under Who can use this connection, decide who in your workspace can use the connection. You start as the only person with access:
  • Only you (default): leave the access list as is; only you can use the connection and its associated data.
  • Invite specific people: add workspace members by email; only you and the people you add can use the connection and its associated data.
  • Invite entire workspace: click Invite entire workspace to make the connection available to everyone in your Lovable workspace.
See Who can use connections and clients for more information.
6

Connect

Click Connect. Lovable verifies the service account against Firebase Cloud Messaging before saving the connection.
When connected, anyone building in a project can ask Lovable in chat to link their project to Firebase Cloud Messaging (based on configured connection-level access). Your Lovable apps can then send notifications through your Firebase project.

​
Sending notifications from your app

Server code sends through Lovable’s connector gateway, not fcm.googleapis.com directly. Ask Lovable in chat to wire sends after the connection is linked to the project. Each message targets exactly one of:
  • A device token collected by the Firebase client SDK in your app and stored by you
  • A topic name that devices already subscribed to
  • An FCM condition expression
A token that returns UNREGISTERED (or some INVALID_ARGUMENT errors) is stale. Delete it from your database instead of retrying it. The connector does not collect tokens. Android, iOS, and web clients obtain them with the Firebase SDK, then your app stores them for later sends.

​
Browser push

Select Include web push when you want people who are signed in to opt in from the browser. Lovable syncs the public web values onto the linked project so generated client code can initialize Firebase Messaging. You still need a click (for example a button) before the browser shows a permission prompt. The Lovable preview runs your app in an iframe. Browsers block the notification permission prompt there. Open the preview in its own tab, or test on the published app. If you connected with Server or native only and later need browser registration, update the connection and switch Client setup to Include web push, then fill in the web fields.

​
Limitations

The Firebase Cloud Messaging connector cannot:
  • Register devices or obtain FCM tokens. Your app’s Firebase client SDK does that, and your backend stores the tokens.
  • Read delivery analytics, open rates, or per-user reach. Those live in the Firebase console (and its BigQuery export, if you enable it).
  • Connect Firebase Authentication, Realtime Database, Cloud Storage, or Analytics. This connector is for Cloud Messaging only.
  • Receive FCM webhooks or inbound events.
  • Support per-end-user Firebase login. Each connection represents a single Firebase project shared across all projects linked to it.
If the service account is disabled or the key is revoked in Google Cloud, update the Lovable connection with a new key before sends can succeed again.

​
Troubleshooting

Use these checks when connect fails or browser push never prompts.
Confirm the file is a service account key ("type": "service_account"), not an OAuth client file, and that it includes project_id. The account needs the Firebase Cloud Messaging API Admin role on the Firebase project. Generate a new key from Project settings → Service accounts if you are unsure.
Test in a top-level tab, not the in-editor preview iframe. Ask Lovable to detect that iframe case and show copy that tells the user to open the app in a new tab.
Edit the connection, set Client setup to Include web push, and fill in Firebase API key, Firebase App ID, and Web Push VAPID key. Then link the connection to the project again if needed.

​
Manage your connection

Connections are managed from Connectors: select , then open the connection.
  • Unlink projects to remove access from specific projects while keeping the connection available for others. See Unlink projects from a connection for the steps.
  • Delete the connection to remove it from the workspace entirely. Deleting is permanent. It removes the credentials from all linked projects, and app features that use stop working until a new connection is added. See Delete a connection for the steps and who can delete.

Related topics

Lovable changelogConnect your app to TwilioDeploying and hosting outside LovableConnect your app to GatewayAPIConnect your app to Brevo