如何向浏览器的 Javascript 应用程序发送静默推送？答案

【问题标题】：How do I send a silent push to my browser's Javascript app?如何向浏览器的 Javascript 应用程序发送静默推送？
【发布时间】：2018-10-05 16:00:07
【问题描述】：

我正在使用 Firebase，但我不确定它是否相关。

我正在尝试向在浏览器中运行的应用程序发送静默推送（这是一个 JS/React 单页应用程序），根据 Firebase FCM 文档，我所要做的就是发送一条带有“数据"键。

但是，这对我不起作用：如果我的消息没有“通知”键，则浏览器不会收到它。

为了测试这一点，我运行了这 2 个 curl 命令：

curl -H "Content-type: application/json" -H "Authorization:key=<MYKEY>"  -X POST -d '{ "data": { "foo": "1","bar": "2"},"to" : "<TOKEN>", "notification": { "data" : "Some data" } }' https://fcm.googleapis.com/fcm/send

curl -H "Content-type: application/json" -H "Authorization:key=<MYKEY>"  -X POST -d '{ "data": { "foo": "1","bar": "2"},"to" : "<TOKEN>" }' https://fcm.googleapis.com/fcm/send

第一个在应用“打开”时进入浏览器，并在应用“关闭”（标签关闭或浏览器关闭）时进入通知中心。

第二个从来没有达到任何东西（但是对 curl 调用的响应给出“成功”：1，“失败”：0）

我做错了什么？这只是 WebPush 不支持吗？我在网上阅读了相互矛盾的信息。

在某些情况下，静默推送对于在浏览器中更新客户端状态非常有用。例如，如果我构建了一个带有频道/组的聊天应用程序，我希望能够在没有用户可见通知的情况下向客户端发送有关聊天状态的更新：我不希望用户看到例如，当聊天组的参与者有更新时，明确的“over the top”通知：我只想在浏览器的 UI 中更新它，尤其是当应用程序在前台时。

【问题讨论】：

标签： javascript push-notification firebase-cloud-messaging web-push

【解决方案1】：

我通过在我的 service worker 中使用 Firebase 的 setBackgroundMessageHandler() 注册一个处理程序解决了这个问题。

Firebase 的文档指出，这仅在“仅数据”推送（即静默）的后台处理中需要，但事实证明，前台处理似乎也需要它（即使您的处理程序什么都不做。）

一旦我注册了我的虚拟处理程序，我就开始在前台接收到应用程序的静默推送。

【讨论】：