---
title: "JavaScript SDK: Push notifications"
description: "Set up push notifications for customer messages with the Gleap JavaScript SDK. Follow the integration code examples."
url: https://docs.gleap.ai/en/articles/402-javascript-sdk-push-notifications
collection: "JavaScript"
updated: 2026-11-01
language: en
---

# JavaScript SDK: Push notifications

Set up push notifications for customer messages with the Gleap JavaScript SDK. Follow the integration code examples.

Stay connected with your customers by utilizing push notifications to alert them of new chat messages, release notes, and news articles. This will deepen engagement and foster stronger relationships.

Gleap supports [Firebase Cloud Messaging](https://firebase.google.com/docs/cloud-messaging) to send push notifications to users.

## Setup Firebase Cloud Messaging

To make use of Gleap Push Notifications you must add the Firebase Cloud Messaging service to your app or website. Learn how to get started with FCM [here](https://firebase.google.com/docs/cloud-messaging/js/client).

## Getting your Firebase Cloud Messaging Token

Open your project in Firebase and open the project settings.

Click on "Cloud Messaging" and, if it is not already enabled, activate the Firebase Cloud Messaging API (V1).

![Firebase Cloud Messaging API v1 settings in the existing example project.](https://staticfiles.gleap.io/p613b5dd730aed737108f87ab/EXsrhvuamORx0xa4YtpmZJLx4XMOleKSVb6TBLALNylbZ14MDv1sYjLjJyqQKq2vtu3fAsIo4uf.png)

Proceed to the "Service Accounts" section and generate a new private key, which will automatically create a file named like `serviceAccountKey.json`.

![Firebase service-account setup in the existing example project. No private key is displayed.](https://staticfiles.gleap.io/p613b5dd730aed737108f87ab/3L6WWg4TfpUDuiPLiyLesRpKNB76FF1eO4geLNXJnFQPDCnJqHFf0jyWRy7EArmsw8yjT2uITrs.png)

In Gleap, open Settings → Developer → Push notifications and upload the Firebase service-account JSON file. Keep the file private; it authorizes push delivery for the Firebase project.

![Push notification service-account file upload. No credential is shown.](https://staticfiles.gleap.io/p613b5dd730aed737108f87ab/P0ExxlppVbgauOrnK6goEgpy9DwTz5Ov3oHyxwBLNQNVfiXkOmA5Fs7cHQPhzZnopvdi2bMl7dL.png)

## Subscribe to the Gleap user topic

The last step to complete the push notification setup is to subscribe to the user topic, which Gleap will send the push notifications to.

First, in order to proceed, it is necessary to obtain the registration token from Firebase. For more detailed information, please refer to the documentation provided by Firebase [here](https://firebase.google.com/docs/cloud-messaging/js/client).

```js
const token = await getToken(messaging, {
  vapidKey: "<YOUR_VAPID_KEY>",
  serviceWorkerRegistration,
});
```

Next, it is important to register the callbacks for subscribing and unsubscribing from push message topics.

```js
Gleap.on("unregister-pushmessage-group", (topic) => {
  // TODO: Send topic to your server
});

Gleap.on("register-pushmessage-group", (topic) => {
  // TODO: Send topic to your server
});
```

Once you have obtained both the Firebase registration token and the Gleap topic, you should send this information to your server. On your server, you will need to subscribe the topic to the token. For more detailed information, please refer to the documentation provided by Firebase [here](https://firebase.google.com/docs/cloud-messaging/js/topic-messaging).

```js
firebaseAdmin.messaging().subscribeToTopic(token, topic);
```

That's it - build and run your app 🚀

## Notification images

When a changelog or news article with a featured image is sent as a push notification, Gleap includes the image in the web push payload (`notification.image`). Browsers that support notification images (e.g. Chrome and Edge) display it automatically — no additional setup is required.

## Related

- [JavaScript SDK setup](https://docs.gleap.ai/en/articles/393-javascript-sdk-setup.md)
- [JavaScript SDK: Code snippet](https://docs.gleap.ai/en/articles/394-javascript-sdk-code-snippet.md)
- [JavaScript SDK: User identity](https://docs.gleap.ai/en/articles/395-javascript-sdk-user-identity.md)
- [JavaScript SDK: Callbacks](https://docs.gleap.ai/en/articles/396-javascript-sdk-callbacks.md)
- [JavaScript SDK: AI chatbar](https://docs.gleap.ai/en/articles/397-javascript-sdk-ai-chatbar.md)