Flutter FCM推送通知问题：前台收不到通知、点击无法跳转组件

问题1：应用前台无法收到通知 #

原因分析 #

• 本地通知初始化时使用了assets路径的图标，Android系统无法识别该路径的资源
• 重复调用本地通知初始化方法，导致通道创建异常
• 通知通道优先级设置过低，前台无法弹出通知

修复步骤 #

1. 修正通知图标路径：将通知图标文件（如ic_notification.png）放入android/app/src/main/res/drawable目录，修改本地通知初始化代码：

// firebase_api.dart - initLocalNotifications方法
const android = AndroidInitializationSettings('ic_notification'); // 替换为drawable目录下的图标文件名

2. 移除重复初始化调用：删除main.dart中重复的initLocalNotifications()调用，因为initNotifications()内部已经执行过该方法：

// main.dart - main函数中移除此行
// await firebaseApi.initLocalNotifications();

3. 提升通知通道优先级：将通知通道的importance改为Importance.high：

// firebase_api.dart
static const _androidChannel = AndroidNotificationChannel(
  'my_app_notifications',
  'My App Notifications',
  description: 'My App Notifications',
  importance: Importance.high, // 修改为high
);

问题2：后台点击通知无法跳转到指定页面 #

原因分析 #

• MaterialApp未关联全局navigatorKey，导致无法获取导航上下文
• 后台消息回调中直接调用Navigator，但后台隔离环境无UI上下文
• 路由表未注册NotificationWidget
• 本地通知点击回调的payload处理逻辑错误

修复步骤 #

1. 关联全局导航Key：在MyApp的MaterialApp中配置navigatorKey：

// main.dart - MyApp类
class MyApp extends StatelessWidget {
  const MyApp({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      navigatorKey: navigatorKey, // 绑定全局导航Key
      title: 'My App',
      initialRoute: '/',
      routes: {
        '/': (context) => const HomeScreen(), // 替换为你的首页组件
        NotificationWidget.route: (context) => const NotificationWidget(), // 注册通知页面路由
      },
    );
  }
}

2. 移除后台消息中的导航代码：后台回调无法访问UI上下文，仅保留日志记录：

// firebase_api.dart - handleBackgroundMessage方法
Future<void> handleBackgroundMessage(RemoteMessage? message) async {
  await Firebase.initializeApp(
    options: DefaultFirebaseOptions.currentPlatform,
  );

  if (message == null) return;

  print("Background Message received: ${message.data}");
  // 后台环境禁止调用Navigator，仅做日志处理
}

3. 修正本地通知点击回调逻辑：正确解析通知payload：

// firebase_api.dart - initLocalNotifications方法
await _localNotifications.initialize(
  settings,
  onDidReceiveNotificationResponse: (response) {
    if (response.payload == null) return;
    final message = RemoteMessage.fromMap(jsonDecode(response.payload!));
    handleMessage(message);
  },
);

额外检查项 #

• 确认Android端google-services.json、iOS端GoogleService-Info.plist配置正确
• iOS端需在Info.plist中添加推送权限配置：

  <key>UIBackgroundModes</key>
  <array>
    <string>remote-notification</string>
  </array>
  

• 测试后台通知时，确保发送的FCM消息包含notification字段（纯data消息需自行处理显示逻辑）

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