How to Add Push Notifications to Your FlutterFlow Project

Open your FlutterFlow project and navigate to Settings (gear icon in the left panel) > Notifications. Toggle 'Enable Push Notifications' to on. FlutterFlow will automatically add the firebase_messaging package to your project and generate the required AndroidManifest.xml changes for Android. For iOS, you also need to add the Push Notifications capability — FlutterFlow handles this in the generated Xcode project. Once enabled, a confirmation banner appears and the toggle stays green. This step takes about 30 seconds and has no cost on any FlutterFlow plan.

iOS notifications require an Apple Push Notification service key uploaded to Firebase. In Apple Developer Portal, go to Certificates, Identifiers & Profiles > Keys > click the + button. Name the key, check 'Apple Push Notifications service (APNs)', and click Continue then Register. Download the .p8 key file — you can only download it once. Note your Key ID and Team ID (visible in Membership section). In Firebase Console, go to Project Settings > Cloud Messaging > Apple app configuration and upload the .p8 file along with the Key ID and Team ID. Back in FlutterFlow Settings > Notifications, confirm the APNs status shows as configured.

Users must grant notification permission before your app can deliver any notifications. Find the page in your app where it makes the most sense to ask — typically the end of onboarding or when a feature that requires notifications is first used. Select a Button widget, open its On Tap action flow, and click Add Action. Search for 'Request Notification' and select 'Request Notification Permission' from the FlutterFlow Actions list. Add a conditional branch after it: if permission is Granted, proceed normally; if Denied, show an informational alert explaining why notifications matter and offering to open Settings. Avoid asking for notification permission on first app launch before the user understands your app's value.

The FCM token is the device address you need to send targeted notifications. After the user grants permission, retrieve and store this token so your backend can find it later. In the same action flow, after the permission grant branch, add a Custom Action (or use the Get FCM Token action if visible in your FlutterFlow version). Then add an Update Document action targeting the current user's document in your 'users' Firestore collection. Set the field 'fcm_token' to the output of the Get FCM Token action. Also store 'fcm_token_updated_at' as the current timestamp so you can detect stale tokens. Do this on every app launch — tokens can rotate and you always want the freshest one.

1import 'package:firebase_messaging/firebase_messaging.dart';
2import 'package:cloud_firestore/cloud_firestore.dart';
3import 'package:firebase_auth/firebase_auth.dart';
4
5Future<void> saveFcmToken() async {
6  final String? token = await FirebaseMessaging.instance.getToken();
7  final String? userId = FirebaseAuth.instance.currentUser?.uid;
8
9  if (token == null || userId == null) return;
10
11  await FirebaseFirestore.instance
12      .collection('users')
13      .doc(userId)
14      .update({
15        'fcm_token': token,
16        'fcm_token_updated_at': FieldValue.serverTimestamp(),
17        'platform': Theme.of(navigatorKey.currentContext!).platform.name,
18      });
19
20  // Listen for token refresh
21  FirebaseMessaging.instance.onTokenRefresh.listen((newToken) {
22    FirebaseFirestore.instance
23        .collection('users')
24        .doc(userId)
25        .update({'fcm_token': newToken});
26  });
27}

Before writing any backend code, confirm the entire chain works using the Firebase Console. Go to Firebase Console > Engage > Messaging > Send your first message. Enter a notification title and body text. Click 'Send test message' (not the full campaign flow). Paste the FCM token you saved in the previous step into the test dialog and click Test. The notification should appear on the device within 5-10 seconds. On iOS, make sure your device has granted notification permission and that your APNs key was uploaded correctly. On Android, make sure the app is not in the foreground (background or closed for the system tray notification to show).