Firebase Cloud Messaging in Flutter: Complete Push Notification Setup Guide

Introduction

Push notifications are one of the most important features for modern mobile applications.

They allow apps to:

• Notify users instantly
• Increase engagement
• Send marketing updates
• Trigger real-time alerts

Firebase Cloud Messaging (FCM) is a free and scalable push notification service provided by Firebase.

In this complete guide, we will explore:

• How FCM works
• Flutter setup
• Foreground notifications
• Background handling
• Notification click actions
• Sending notifications from backend
• Production best practices

How Firebase Cloud Messaging Works

Backend Server
     ↓
Firebase Cloud Messaging Server
     ↓
Device (via FCM Token)

Each device gets a unique FCM token. Notifications are sent to that token.

Add Required Package

dependencies:
  firebase_messaging: latest_version

Run:

flutter pub get

Request Notification Permission (iOS)

FirebaseMessaging messaging = FirebaseMessaging.instance;

NotificationSettings settings =
    await messaging.requestPermission(
      alert: true,
      badge: true,
      sound: true,
    );

Get FCM Token

String? token = await FirebaseMessaging.instance.getToken();
print("FCM Token: $token");

Store this token in Firestore or backend.

Handle Foreground Messages

FirebaseMessaging.onMessage.listen((RemoteMessage message) {
  print("Foreground message received");
  print(message.notification?.title);
});

Handle Background Messages

Future _firebaseMessagingBackgroundHandler(
    RemoteMessage message) async {
  print("Background message received");
}

FirebaseMessaging.onBackgroundMessage(
    _firebaseMessagingBackgroundHandler);

Handle Notification Click

FirebaseMessaging.onMessageOpenedApp.listen(
  (RemoteMessage message) {
    print("Notification clicked");
  },
);

Send Notification from Firebase Console

• Go to Firebase Console
• Select Cloud Messaging
• Create notification
• Select target app

Send Notification from Backend (Node.js)

const admin = require("firebase-admin");

admin.messaging().send({
  token: userFcmToken,
  notification: {
    title: "New Message",
    body: "You received a new chat message"
  }
});

Data vs Notification Messages

• Notification message → handled automatically by system
• Data message → handled manually in app

Silent Push Notification

Send data-only message for background updates.

Store Token in Database

await FirebaseFirestore.instance
  .collection('users')
  .doc(userId)
  .update({
    'fcmToken': token,
  });

Refresh FCM Token

FirebaseMessaging.instance.onTokenRefresh.listen((newToken) {
  print("New Token: $newToken");
});

Production Best Practices

• Store FCM tokens securely
• Handle token refresh
• Use topics for group notifications
• Use data messages for custom logic
• Avoid sending spam notifications

Subscribe to Topic

FirebaseMessaging.instance.subscribeToTopic("offers");

Unsubscribe from Topic

FirebaseMessaging.instance.unsubscribeFromTopic("offers");

Common Beginner Mistakes

• Not handling background messages
• Ignoring token refresh
• Not requesting permission on iOS
• Hardcoding tokens

Scaling Strategy

• Use topics for bulk notifications
• Segment users by behavior
• Track notification delivery

Security Considerations

• Do not expose server keys
• Send notifications from backend only
• Validate user tokens

Conclusion

Firebase Cloud Messaging is a powerful tool for building real-time engagement in Flutter apps.

By properly handling foreground, background, and click events, you can create a seamless notification experience.

Next, we will explore: Firebase App Check (Protect Backend from Abuse).