Flutter Firebase消息推送 - 应用程序打开时未显示推送通知

Question

我是Flutter的新手，目前正在尝试将firebase推送通知发送到我的Flutter应用。当应用程序关闭和在后台时，可以接收到推送通知。但是当应用程序打开时，虽然可以接收推送通知，但它没有显示警报通知（如果应用程序已打开，我希望以警报的形式在我的应用程序中显示推送通知标题和正文内容）。以下是我的代码。

_fcm.configure(
      onMessage: (Map<String, dynamic> message) async {
        showDialog(
          context: context,
          builder: (context) => AlertDialog(
            content: ListTile(
              title: Text(message['notification']['title']),
              subtitle: Text(message['notification']['body']),
            ),
            actions: <Widget>[
              FlatButton(
                child: Text('Ok'),
                onPressed: () => Navigator.of(context).pop(),
              ),
            ],
          ),
        );
        print("onMessage: $message");
      },
      onLaunch: (Map<String, dynamic> message) async {
        print("onLaunch: $message");
        
      },
      onResume: (Map<String, dynamic> message) async {
        print("onResume: $message");
      },
    );

能否有人帮我解决这个问题？

- Prabhashi Buddhima

Answer 1

最终，我使用了overlay_support包解决了我的问题。

我参考了以下问题链接： Flutter - Firebase Messaging Snackbar not showing Flutter - how to get current context? 通过以下教程和包，我成功地解决了我的问题：

教程：https://medium.com/flutter-community/in-app-notifications-in-flutter-9c1e92ea10b3 包：https://pub.dev/packages/overlay_support/install 我将我的MaterialApp()小部件包装在OverlaySupport()小部件中。

return OverlaySupport(
            child: MaterialApp(....
               
          ));

然后我将showOverlayNotification添加到我的_fcm.configure中--> onMessage:

_fcm.configure(
      onMessage: (Map<String, dynamic> message) async {
        print("onMessage: $message");
        showOverlayNotification((context) {
          return Card(
            margin: const EdgeInsets.symmetric(horizontal: 4),
            child: SafeArea(
              child: ListTile(
                leading: SizedBox.fromSize(
                    size: const Size(40, 40),
                    child: ClipOval(
                        child: Container(
                      color: Colors.black,
                    ))),
                title: Text(message['notification']['title']),
                subtitle: Text(message['notification']['body']),
                trailing: IconButton(
                    icon: Icon(Icons.close),
                    onPressed: () {
                      OverlaySupportEntry.of(context).dismiss();
                    }),
              ),
            ),
          );
        }, duration: Duration(milliseconds: 4000));

        print(message['notification']['title']);
      },
      onLaunch: (Map<String, dynamic> message) async {
        print("onLaunch: $message");
      },
      onResume: (Map<String, dynamic> message) async {
        print("onResume: $message");
      },
    );

- Prabhashi Buddhima

Answer 2

您可以使用Get包在应用程序前台时，当用户收到通知时显示一个SnackBar。

_fcm.configure(
  onMessage: (Map<String, dynamic> message) async {
    Get.snackbar("message['notification']['title']", snackPosition: SnackPosition.TOP,);
  },
  onLaunch: (Map<String, dynamic> message) async {
    print("onLaunch: $message");
  },
  onResume: (Map<String, dynamic> message) async {
    print("onResume: $message");
  },
);

'snackPosition'参数允许将snackBar显示在顶部，从而呈现为警报消息。

有一个很好的解释，说明如何将flutter_local_notifications包与FCM一起使用，在这里（链接）

- Hari Aditya

Answer 3

如果你已经将手机连接到电脑上并进行测试，它将不会显示通知。我也遇到了同样的问题，所以我构建了 APK 然后再次尝试，结果它实际上可以工作。

- Akashgreninja

---

谢谢你的回答！我一直在跟着教程（他使用模拟器）。他使用 Firebase 云消息网站来推送通知。我也尝试了，但没有显示任何内容。很高兴知道为什么它不起作用 :D - Jay

Answer 4

FCM提供了三个回调函数：OnResume、OnLaunch和OnMessage。

当应用程序在前台运行时，将触发 onMessage 回调函数，您可以利用此机会执行任何自定义操作。

如果想要在应用程序在前台运行时显示通知，可以使用Flutter 本地通知包。

由于在onMessage回调中缺少上下文，您可能无法看到警报对话框。尝试将 _fcm.configure 包装在内部。

SchedulerBinding.instance.addPostFrameCallback((_){ [_fcm.configure block] });

- Ronak Punase

---

嗨，我已经尝试了SchedulerBinding.instance.addPostFrameCallback((_){ [_fcm.configure block] }); 但是警告对话框仍然没有显示。 - Prabhashi Buddhima

为什么要使用“showOverlayNotification”？你可以直接使用“showDialog”，并将警报对话框传递给“showDialog”方法。你试过了吗？ - Ronak Punase

Answer 5

实际上，Android的默认行为是在应用程序打开时不显示通知。

因此，如果您希望在应用程序打开时显示通知，则需要在初始化FirebaseApp和FirebaseMessaging之后添加以下行。

FirebaseMessaging.instance.setForegroundNotificationPresentationOptions(alert: true,badge: true,sound: true);

- Israr

---

太棒了！... - a.snss

Answer 6

处理应用程序打开时通知的新方法如下：

  // Called when the app is in background state
  FirebaseMessaging.onMessageOpenedApp.listen((RemoteMessage message) async {
    await _handleMessage(message);
  });

  // Called when the app is in foreground (open)
  FirebaseMessaging.onMessage.listen((RemoteMessage message) async {
    await _handleMessage(message);
  });

- Youssef Elmoumen