React Native Android端FCM通知添加操作按钮问题求助

你的问题核心是Android端未配置通知操作按钮的对应逻辑——iOS通过category关联客户端预设的操作，但Android需要同时在服务端消息中定义按钮信息、客户端完成操作映射才能生效。以下是具体修复步骤：

1. 服务端（FCM API v1）修改 #

在android.notification节点下添加actions数组，明确每个操作按钮的显示文本与唯一标识：

async function sendNotification(topic, medicationName, scheduledTime) {
    const accessToken = await getAccessToken();

    const response = await fetch(
        "https://fcm.googleapis.com/v1/projects/my-sobrus-beta/messages:send",
        {
            method: "POST",
            headers: {
                "Content-Type": "application/json",
                Authorization: `Bearer ${accessToken}`,
            },
            body: JSON.stringify({
                message: {
                    topic: topic,
                    notification: {
                        title: // 你的通知标题,
                        body: // 你的通知内容,
                    },
                    android: {
                        notification: {
                            sound: "default",
                            click_action: // 你的点击意图ID,
                            channelId: // 你的渠道ID,
                            // 新增：定义Android通知操作按钮
                            actions: [
                                {
                                    icon: "ic_notification_confirm", // 可选：本地资源图标名（单色矢量图）
                                    title: "确认", // 按钮显示文本
                                    action: "ACTION_CONFIRM" // 按钮唯一标识，客户端用来判断点击事件
                                },
                                {
                                    icon: "ic_notification_cancel",
                                    title: "取消",
                                    action: "ACTION_CANCEL"
                                }
                            ]
                        },
                        priority: "HIGH",
                    },
                    apns: {
                        payload: {
                            aps: {
                                sound: "default",
                                category: // 你的iOS category ID,
                                contentAvailable: true,
                                mutableContent: true,
                            },
                        },
                    },
                    data: {
                        // 你的自定义数据
                    },
                },
            }),
        }
    );

    const responseData = await response.json();
    console.log(responseData);
}

2. React Native客户端配置 #

（1）修改通知分类配置，新增Android支持 #

你当前的setupNotificationCategories仅处理iOS，需要补充Android端的操作映射：

import PushNotification from 'react-native-push-notification';
import PushNotificationIOS from '@react-native-community/push-notification-ios';
import {Platform} from 'react-native';

export function setupNotificationCategories() {
    if (Platform.OS === 'ios') {
        PushNotificationIOS.setNotificationCategories([
            {
                id: // 你的iOS category ID,
                actions: [
                    // iOS操作按钮原有配置
                ],
            },
        ]);
    } else if (Platform.OS === 'android') {
        // Android操作按钮映射，identifier需与服务端action字段完全一致
        PushNotification.setNotificationCategories([
            {
                id: "MEDICATION_NOTIFICATION_CATEGORY", // 自定义分类ID
                actions: [
                    {
                        identifier: "ACTION_CONFIRM",
                        title: "确认",
                        activationMode: "foreground", // 点击后唤起应用前台
                        destructive: false,
                        authenticationRequired: false
                    },
                    {
                        identifier: "ACTION_CANCEL",
                        title: "取消",
                        activationMode: "background", // 点击后后台处理逻辑
                        destructive: true,
                        authenticationRequired: false
                    }
                ]
            }
        ]);
    }
}

（2）处理操作按钮点击事件 #

在handleNotification中通过action字段区分用户点击的按钮：

export function handleNotification(notification) {
    if (notification.action) {
        // 根据服务端定义的标识执行对应逻辑
        switch(notification.action) {
            case "ACTION_CONFIRM":
                // 触发确认操作的API请求
                console.log("用户点击确认按钮");
                break;
            case "ACTION_CANCEL":
                // 执行取消操作逻辑
                console.log("用户点击取消按钮");
                break;
            default:
                break;
        }
    } else {
        // 处理通知主体的点击事件
        console.log("用户点击通知本身");
    }
}

（3）检查通知渠道配置 #

你的渠道importance:4（对应Android IMPORTANCE_DEFAULT）足够显示操作按钮，若后续仍有问题，可尝试将importance设为5（IMPORTANCE_HIGH），确保通知置顶显示。

3. 额外注意事项 #

• 确保react-native-push-notification库为最新版本，旧版本可能存在Android操作按钮的兼容bug。
• Android 12+要求操作按钮图标为单色矢量图，否则图标不显示，但文本按钮仍正常展示。
• 测试前请卸载旧版本应用重新安装，避免缓存的渠道或配置干扰结果。

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