Send a test message to a backgrounded app

To get started with FCM, build out the simplest use case: sending a notification message to a specific user when the app is in the background on the device. This page lists all the steps to achieve this, from setup to verification — it may cover steps you already completed if you have set up a JavaScript client app for FCM.

Set up the SDK

If you haven't already, add Firebase to your JavaScript project.

Access the registration token

When you need to retrieve the current registration token for an app instance, first request notification permissions from the user with Notification.requestPermission(). When called as shown, this returns a token if permission is granted or rejects the promise if denied: 

function requestPermission() {
  console.log('Requesting permission...');
  Notification.requestPermission().then((permission) => {
    if (permission === 'granted') {
      console.log('Notification permission granted.');

FCM requires a firebase-messaging-sw.js file. Unless you already have a firebase-messaging-sw.js file, create an empty file with that name and place it in the root of your domain before retrieving a token. You can add meaningful content to the file later in the client setup process.

To retrieve the current token:

Web

import { getMessaging, getToken } from "firebase/messaging";

// Get registration token. Initially this makes a network call, once retrieved
// subsequent calls to getToken will return from cache.
const messaging = getMessaging();
getToken(messaging, { vapidKey: '<YOUR_PUBLIC_VAPID_KEY_HERE>' }).then((currentToken) => {
  if (currentToken) {
    // Send the token to your server and update the UI if necessary
    // ...
  } else {
    // Show permission request UI
    console.log('No registration token available. Request permission to generate one.');
    // ...
  }
}).catch((err) => {
  console.log('An error occurred while retrieving token. ', err);
  // ...
});
messaging_get_token.js

Web

// Get registration token. Initially this makes a network call, once retrieved
// subsequent calls to getToken will return from cache.
messaging.getToken({ vapidKey: '<YOUR_PUBLIC_VAPID_KEY_HERE>' }).then((currentToken) => {
  if (currentToken) {
    // Send the token to your server and update the UI if necessary
    // ...
  } else {
    // Show permission request UI
    console.log('No registration token available. Request permission to generate one.');
    // ...
  }
}).catch((err) => {
  console.log('An error occurred while retrieving token. ', err);
  // ...
});
index.js

After you've obtained the token, send it to your app server and store it using your preferred method.

Send a test notification message

  1. Install and run the app on the target device. On Apple devices, you'll need to accept the request for permission to receive remote notifications.

  2. Make sure the app is in the background on the device.

  3. In the Firebase console, open the Messaging page.

  4. If this is your first message, select Create your first campaign.

    1. Select Firebase Notification messages and select Create.

  5. Otherwise, on the Campaigns tab, select New campaign and then Notifications.

  6. Enter the message text. All other fields are optional.

  7. Select Send test message from the right pane.

  8. In the field labeled Add an FCM registration token, enter the registration token you obtained in a previous section of this guide.

  9. Select Test.

After you select Test, the targeted client device (with the app in the background) should receive the notification.

Next steps

Send messages to foregrounded apps

Once you have successfully sent notification messages while your app is in the background, see Receive Messages in a JavaScript Client to get started sending to foregrounded apps.

Go beyond notification messages

To go beyond notification messages and add other, more advanced behavior to your app, see: