Flutter中点击FCM通知无法跳转指定页面问题求助

问题描述 #

我正在使用Firebase Cloud Messaging API测试Flutter应用的推送通知，通知功能正常，但点击通知时无法正确处理页面导航。

当前实现代码（main.dart中）：

Future<void> setupMessages() async {
    RemoteMessage? message =
        await FirebaseMessaging.instance.getInitialMessage();

    if (message != null) {
      handleNavigation(message, context); 
    }

    FirebaseMessaging.onMessageOpenedApp.listen((RemoteMessage message) {
      handleNavigation(message, context); 
    });
  }

  void handleNavigation(RemoteMessage message, BuildContext context) {
    if (message.data['type'] == 'request') {
      Navigator.pushNamed(context, UserRequests.id);
      print('NOTIFICATION TYPE =====> ${message.data['type']}');
    }
  }

 void initState() {
    super.initState();
    setupMessages(context);
  }

FCM请求体：

{
  "to": <User token>,
  "notification": {
    "title": "Title",
    "body": "Body"
  },
  "data": {
    "type": "request"
  }
}

现象：应用处于后台时点击通知，会被重定向到应用主页，而非UserRequests()页面。已确认路由配置无误，且打印的type值为'request'，不清楚跳转失效的原因。

解决方案 #

1. 补充FCM Payload的click_action配置 #

当应用处于后台时，系统会直接处理notification字段生成通知，需添加click_action指定点击事件的处理逻辑，确保消息能传递到Flutter层：

{
  "to": <User token>,
  "notification": {
    "title": "Title",
    "body": "Body",
    "click_action": "FLUTTER_NOTIFICATION_CLICK"
  },
  "data": {
    "type": "request"
  }
}

2. 配置AndroidManifest.xml的Intent Filter #

在Android项目的android/app/src/main/AndroidManifest.xml中，给MainActivity添加匹配FLUTTER_NOTIFICATION_CLICK的intent filter，保证点击通知时能正确触发Flutter的消息回调：

<activity
    android:name=".MainActivity"
    android:exported="true">
    <!-- 保留原有配置 -->
    <intent-filter>
        <action android:name="FLUTTER_NOTIFICATION_CLICK" />
        <category android:name="android.intent.category.DEFAULT" />
    </intent-filter>
</activity>

3. 使用全局导航Key避免Context失效问题 #

页面局部context在应用后台唤醒时可能已失效，改用全局导航Key来管理导航：

• 定义全局Key：

final GlobalKey<NavigatorState> navigatorKey = GlobalKey<NavigatorState>();

• 在MaterialApp中配置：

MaterialApp(
  navigatorKey: navigatorKey,
  routes: {
    // 你的路由配置
    UserRequests.id: (context) => UserRequests(),
  },
)

• 修改导航逻辑：

void handleNavigation(RemoteMessage message) {
  if (message.data['type'] == 'request') {
    navigatorKey.currentState?.pushNamed(UserRequests.id);
    print('NOTIFICATION TYPE =====> ${message.data['type']}');
  }
}

4. 全局初始化消息监听逻辑 #

将消息监听逻辑移到main函数中初始化，避免依赖某个页面的生命周期，确保应用启动时就完成监听：

void main() async {
  WidgetsFlutterBinding.ensureInitialized();
  await Firebase.initializeApp();
  await setupMessages();
  runApp(MyApp());
}

Future<void> setupMessages() async {
  // 处理应用完全关闭时点击通知的情况
  RemoteMessage? message = await FirebaseMessaging.instance.getInitialMessage();
  if (message != null) {
    handleNavigation(message);
  }

  // 处理应用后台时点击通知的情况
  FirebaseMessaging.onMessageOpenedApp.listen((RemoteMessage message) {
    handleNavigation(message);
  });
}

内容的提问来源于stack exchange，提问作者leuji