React Native中react-native-fcm推送通知异常：仅前台特定屏幕可接收

看起来你遇到的核心问题是推送监听只绑定在了通知页面，没有全局注册，同时平台层面的后台配置也没到位。下面一步步帮你排查解决：

一、全局注册推送监听（关键！） #

你现在应该是只在通知页面里初始化了FCM监听，这就导致只有这个页面在前台时才能收到通知。要实现全场景接收，需要把监听逻辑放在全局入口文件（比如App.js或者单独的推送服务文件）里，确保APP启动时就注册监听：

// App.js 全局入口
import React, { Component } from 'react';
import { Platform } from 'react-native';
import FCM, { FCMEvent, RemoteNotificationResult, WillPresentNotificationResult, NotificationType } from 'react-native-fcm';

class App extends Component {
  componentDidMount() {
    // 监听所有状态下的通知（前台/后台/杀死后点击通知）
    FCM.on(FCMEvent.Notification, async (notif) => {
      console.log('收到通知:', notif);
      // 这里可以写你的通知处理逻辑，比如跳转指定页面、展示弹窗等
      
      // iOS必须手动通知系统处理完成，否则会重复触发
      if (Platform.OS === 'ios') {
        switch (notif._notificationType) {
          case NotificationType.Remote:
            notif.finish(RemoteNotificationResult.NewData);
            break;
          case NotificationType.NotificationResponse:
            notif.finish();
            break;
          case NotificationType.WillPresent:
            notif.finish(WillPresentNotificationResult.All);
            break;
        }
      }
    });

    // 获取设备FCM令牌，发给后端用于定向推送
    FCM.getFCMToken().then(token => {
      console.log('设备令牌:', token);
      // 这里把token传给你的后端服务器
    });

    // 监听令牌刷新，及时更新后端数据
    FCM.on(FCMEvent.RefreshToken, token => {
      console.log('令牌已刷新:', token);
      // 更新后端存储的令牌
    });
  }

  componentWillUnmount() {
    // 全局入口可以不用移除监听，除非你有特殊需求
    FCM.off(FCMEvent.Notification);
  }

  render() {
    // 渲染你的APP主组件
    return (/* ... */);
  }
}

export default App;

二、Android平台后台配置 #

Android要支持后台/杀死状态接收推送，必须做好以下配置：

1. 在AndroidManifest.xml中添加FCM服务：
   打开android/app/src/main/AndroidManifest.xml，确保包含以下服务声明：

   <service android:name="com.evollu.react.fcm.MessagingService">
     <intent-filter>
       <action android:name="com.google.firebase.MESSAGING_EVENT"/>
     </intent-filter>
   </service>
   <service android:name="com.evollu.react.fcm.InstanceIdService">
     <intent-filter>
       <action android:name="com.google.firebase.INSTANCE_ID_EVENT"/>
     </intent-filter>
   </service>
   

2. 推送消息格式要正确：
   后端发送推送时，建议同时包含notification和data字段。如果是纯notification类型，杀死状态下Android会自动显示通知栏，但无法自定义处理；如果是data类型，需要自己处理通知展示。示例推送结构：

   {
     "to": "你的设备令牌",
     "notification": {
       "title": "新消息提醒",
       "body": "这是一条测试推送"
     },
     "data": {
       "targetScreen": "NotificationPage", // 自定义字段，用于跳转指定页面
       "messageId": "123456"
     }
   }
   

三、iOS平台后台配置 #

iOS要支持后台/杀死状态接收，需要完成这些步骤：

1. 开启后台推送权限：
   在Info.plist中添加以下配置：

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

2. 请求用户推送授权：
   在APP启动时主动请求用户授权推送：

   componentDidMount() {
     if (Platform.OS === 'ios') {
       FCM.requestPermissions({
         badge: true,
         sound: true,
         alert: true
       }).then(() => console.log('推送权限已获取'))
         .catch(err => console.log('获取权限失败:', err));
     }
     // 其他监听逻辑...
   }
   

3. 支持静默推送（可选）：
   如果需要在后台静默处理推送，后端发送时要加上content_available: 1字段，这样iOS会唤醒APP处理逻辑。

四、测试注意事项 #

• 不要用模拟器测试APP杀死状态的推送，必须用真实设备，模拟器的推送处理有局限。
• react-native-fcm已经停止维护了，如果项目允许，建议迁移到@react-native-firebase/messaging，新库的兼容性和文档更完善。
• 测试杀死状态推送时，要确保APP完全退出（不是后台挂起），再发送推送测试。

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