FCM推送中webpush.fcm_options.link未传递至Service Worker的问题求助

嘿，我来帮你分析下这个问题，看起来你在FCM Web推送的配置上踩了几个常见的坑，咱们一步步来排查解决：

1. 先搞懂fcm_options.link的生效逻辑 #

FCM V1 API里的webpush.fcm_options.link是和通知绑定的专属字段——只有当你的推送消息包含notification字段时，FCM才会自动解析这个link，并且将其关联到通知的点击行为上。你现在的消息里只设置了webpush.data，没有notification部分，FCM自然不会处理这个link，也不会把它传递到Service Worker的payload里。

2. 两种场景的正确配置方案 #

场景一：需要显示通知并自动跳转

如果你希望用户点击通知时自动跳转到指定链接，消息结构要包含notification字段，示例如下：

{
  "message": {
    "token": "FIREBASE_DEVICE_TOKEN_HERE",
    "notification": {
      "title": "新消息提醒",
      "body": "你收到了一条新消息"
    },
    "webpush": {
      "fcm_options": {
        "link": "/abcde"
      },
      "data": {
        "something": "here"
      }
    }
  }
}

这样配置后，用户点击通知会自动跳转到/abcde，同时你也能在onBackgroundMessage的payload里拿到data字段。

场景二：仅后台处理消息（不显示通知）

如果不需要显示通知，只想在Service Worker里接收跳转链接并自定义处理，那直接把link放到webpush.data里即可：

{
  "message": {
    "token": "FIREBASE_DEVICE_TOKEN_HERE",
    "webpush": {
      "data": {
        "something": "here",
        "link": "/abcde"
      }
    }
  }
}

然后在Service Worker里手动处理跳转逻辑：

messaging.onBackgroundMessage(async (payload) => {
  console.log('[BG] Received background message ', payload);
  if (payload.data.link) {
    // 打开指定链接
    clients.openWindow(payload.data.link);
  }
});

3. 额外的排查点 #

• SDK版本一致性：确保你Service Worker里引入的firebase-messaging-compat.js版本（11.6.0）和React应用里使用的Firebase SDK版本完全一致，避免兼容性问题。
• 配置正确性：检查React应用初始化FCM时的firebaseConfig，其中messagingSenderId必须和Firebase控制台里的项目ID匹配。
• 测试工具验证：可以用Firebase控制台的消息测试工具发送测试消息，排查是否是curl命令构造的消息格式有误。

内容来源于stack exchange