Summary - Push notification

Combine getToken and onMessage to make a notification screen.

Notification screen

A notification screen combines getToken and onMessage. First the device token is obtained and sent to the server, then the onMessage stream is listened to in order to catch foreground notifications. Together these two steps form the foundation of a notification system.

final token = await messaging.getToken();
messaging.onMessage.listen((msg) {
  print(msg.title);
});

Exercise Write a notification flow

Get the messaging instance. First await the token with getToken and print it. Then listen to the onMessage stream and print message.title. Wait 10 milliseconds.

Show example solution

class RemoteMessage {
  final String title;
  RemoteMessage(this.title);
}

class FirebaseMessaging {
  static final FirebaseMessaging instance = FirebaseMessaging._();
  FirebaseMessaging._();
  Future<String?> getToken() async => 'token123';
  Stream<RemoteMessage> get onMessage => Stream.value(RemoteMessage('Merhaba'));
}

void main() async {
  final token = await FirebaseMessaging.instance.getToken();
  print(token);
  FirebaseMessaging.instance.onMessage.listen((message) {
    print(message.title);
  });
  await Future.delayed(Duration(milliseconds: 10));
}

Test yourself

How are token and onMessage used together on a notification screen?
- Token and onMessage are the same variable
- Only the token is printed, onMessage is ignored
- Token is obtained and sent to server, onMessage catches foreground notifications
- onMessage generates the token
Show answer

Token is obtained and sent to server, onMessage catches foreground notifications — The token identifies the device and is sent to the server; onMessage catches foreground notifications. Together they form the notification system.

Print the title

print(message.____);

Show answer

print(message.title);

Notification screen parts

getToken

Device token
onMessage

Foreground notification
RemoteMessage

Notification object
message.title

Notification title

Next lesson: What is image_picker?

We Are Enhancing Your Experience

Cookie Preferences

Strictly Necessary Cookies

Analytical Cookies