How to Get FCM Token in Firebase for Push Notifications

To get the FCM token, use the Firebase Messaging API's getToken() method in your app. This token uniquely identifies the device and is required to send push notifications.

Syntax

The basic syntax to get the FCM token involves calling getToken() from the Firebase Messaging instance. This method returns a promise that resolves to the token string.

• messaging: The Firebase Messaging instance.
• getToken(): Method to request the current registration token.

javascript

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

const messaging = getMessaging();

getToken(messaging, { vapidKey: 'YOUR_PUBLIC_VAPID_KEY' })
  .then((currentToken) => {
    if (currentToken) {
      console.log('FCM Token:', currentToken);
    } else {
      console.log('No registration token available. Request permission to generate one.');
    }
  })
  .catch((err) => {
    console.log('An error occurred while retrieving token. ', err);
  });

Example

This example shows how to request permission from the user, then get and log the FCM token for a web app using Firebase v9 modular SDK.

javascript

import { initializeApp } from 'firebase/app';
import { getMessaging, getToken } from 'firebase/messaging';

const firebaseConfig = {
  apiKey: 'YOUR_API_KEY',
  authDomain: 'YOUR_AUTH_DOMAIN',
  projectId: 'YOUR_PROJECT_ID',
  storageBucket: 'YOUR_STORAGE_BUCKET',
  messagingSenderId: 'YOUR_SENDER_ID',
  appId: 'YOUR_APP_ID',
};

const app = initializeApp(firebaseConfig);
const messaging = getMessaging(app);

Notification.requestPermission().then((permission) => {
  if (permission === 'granted') {
    getToken(messaging, { vapidKey: 'YOUR_PUBLIC_VAPID_KEY' })
      .then((currentToken) => {
        if (currentToken) {
          console.log('FCM Token:', currentToken);
        } else {
          console.log('No registration token available.');
        }
      })
      .catch((err) => {
        console.log('Error retrieving token:', err);
      });
  } else {
    console.log('Notification permission denied.');
  }
});

Output

FCM Token: eXampleToken1234567890abcdef...

Common Pitfalls

Common mistakes when getting the FCM token include:

• Not requesting notification permission before calling getToken().
• Using an incorrect or missing vapidKey in web apps.
• Not handling the case when getToken() returns null.
• Ignoring errors from the getToken() promise.

Always check for permission and handle errors gracefully.

javascript

/* Wrong way: calling getToken without permission */
getToken(messaging)
  .then(token => console.log(token))
  .catch(err => console.error(err));

/* Right way: request permission first */
Notification.requestPermission().then(permission => {
  if (permission === 'granted') {
    getToken(messaging, { vapidKey: 'YOUR_PUBLIC_VAPID_KEY' })
      .then(token => console.log(token))
      .catch(err => console.error(err));
  } else {
    console.log('Permission denied');
  }
});

Quick Reference

Remember these key points when getting the FCM token:

• Request notification permission before calling getToken().
• Use your Firebase project's vapidKey for web apps.
• Handle the case when no token is returned.
• Catch and log errors to debug issues.

Key Takeaways

Always request notification permission before getting the FCM token.

Use the Firebase Messaging getToken() method with your vapidKey for web apps.

Handle cases where the token is null or errors occur.

The FCM token uniquely identifies the device for push notifications.

Keep your Firebase config and keys secure and correct.