React Native应用后台/被杀状态下Firebase推送操作按钮不显示

问题核心原因 #

前台运行时FCM的onMessage回调正常触发，你通过逻辑生成带操作按钮的本地通知；但应用在后台/被杀状态时，如果你推送包含notification payload，安卓/iOS系统会直接渲染系统通知，不会触发你的业务代码，也就不会生成你配置的操作按钮。

修复步骤 #

1. 修改推送 payload 格式 #

所有推送改为纯data类型，不要携带notification字段，标题、内容、click_action等所有参数全部放在data字段中传递。这样无论应用处于什么状态，FCM都会触发消息回调，由你控制通知渲染逻辑。

注意：不要使用Firebase控制台的可视化推送功能测试，该功能会自动添加notification字段，需通过服务端调用FCM API发送纯data payload。

2. 完善后台消息处理逻辑 #

你当前index.js中的后台消息处理器仅打印日志，没有生成带按钮的本地通知，补充逻辑如下：

// 首先导入你的通知辅助类实例，注意路径替换成你实际的路径
import localNotificationService from './app/helpers/NotificationHelper';
import { Platform } from 'react-native';

messaging().setBackgroundMessageHandler(async (remoteMessage) => {
  console.log('后台收到推送:', remoteMessage);
  if (!remoteMessage || !remoteMessage.data) return;
  const { data } = remoteMessage;
  // 逻辑和前台onNotification保持完全一致
  const RandomNumber = Math.floor(Math.random() * 100) + 1;
  let actionData = [];
  if (Platform.OS === 'android') {
    if (data.click_action === 'alert_dashboard') {
      actionData = ["Update contact number"]
    } else if (data.click_action === 'account_edit') {
      actionData = ["Update Email"]
    }
  }
  const options = {
    soundName: 'default',
    playSound: true,
  };
  localNotificationService.showNotification(
    RandomNumber,
    data.title, // 这里注意data里要包含title、body字段
    data.body,
    data,
    options,
    'wapp',
    actionData
  );
});

3. 补全安卓配置 #

• 推送请求头指定priority: high，确保安卓系统可以唤醒应用处理后台消息
• 检查AndroidManifest.xml，确认已添加react-native-push-notification要求的权限和广播接收器配置
• 在NotificationHelper的buildAndroidNotification配置中，确认invokeApp配置符合需求，操作按钮点击后如果需要打开应用可设为true

4. iOS适配（如果需要支持iOS） #

• 提前在PushNotification.configure中注册通知分类（Category），配置对应操作按钮
• 推送的data字段中携带对应category参数，iOS通知才能显示操作按钮

其他优化建议 #

通知id不要使用随机数，建议使用推送data中携带的唯一消息id，避免重复通知问题。

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