Firebase 云消息在离开 window 焦点时不显示通知

Question

最近开始研究 FCM，有两种情况，要么您使用浏览器 window，您将使用事件侦听器在 window 中收到应用内通知，或者如果您关闭浏览器 Z05B8C74CBD96FBF2DE4C1A352702FBF4，您将收到桌面通知.

在我的特殊情况下，每当我在 window 上时，我都会调用 API 以在收到特定消息 object 时获取数据

navigator.serviceWorker.addEventListener("message", ({ data }) => {
  dispatch(getNotifications(10));
});

这工作正常，但是当我有一个打开的选项卡但我在另一个 window 上时，FCM 没有收到此消息 object 并且没有调用事件侦听器，基本上我必须刷新页面或使用 Z05B8C74CBD96FBF2DE4C1A352702 重新聚焦。当我回到选项卡时，请致电 api。

有人有解决方法吗？

Answer 1

遗憾的是，当您在另一个选项卡上时，Firebase 不会显示该消息。

但是您可以使用开箱即用的BroadcastChannel API。 它就像一个魅力。 在您的服务人员中，您可以添加以下内容：

const broadcast = new BroadcastChannel('background-message');

messaging.onBackgroundMessage(message => {
    broadcast.postMessage(message);
})

然后在您的应用程序中收听“背景消息”：

const broadcast = new BroadcastChannel('background-message');
broadcast.onmessage = (event) => {
  console.log('message from service-worker:', event.data)
};

更新：这在 safari 上不起作用，但这个解决方案似乎有效： https://stackoverflow.com/a/57964685/11827624