无法堆叠多个推送通知

Posted 2023-02-24

【中文标题】无法堆叠多个推送通知

【英文标题】：Cannot stack multiple push notifications

【发布时间】：2020-04-10 01:01:03

【问题描述】：

我正在编写将通知推送到浏览器的代码。我显示通知的代码如下所示

const imageWithTextNotification = (reg) => 
            // more options at https://developer.mozilla.org/en-US/docs/Web/API/ServiceWorkerRegistration/showNotification#Syntax
            const options = 
                icon: "imgs/notification.png",

                // 07 - Notification with a body
                body: "Alert!! This is image notification",

                // 09 - Actions on notification click (see sw.js for log)
                actions: [
                     action: "search", title: "Try Searching!" ,
                    // 10 - More Actions
                     action: "close", title: "Forget it!" ,
                ],
                data: 
                    notificationTime: Date.now(),
                    githubUser: "hhimanshu"
                
            
            reg.showNotification("Counter=" + counter++, options)
        

阅读MDN 的文档后，代码应该堆叠多个通知，因为我没有使用options 对象中的tag 属性。

但是，根据我的观察，多个通知不会叠加。相同的通知被替换（参见下面演示中增加的计数器值）。请看下文

可重复的代码库可在https://codesandbox.io/s/charming-hellman-8q4t3 获得，演示可在https://8q4t3.sse.codesandbox.io/ 获得

我已经测试过了

Google Chrome => Version 80.0.3987.163 (Official Build) (64-bit)
Firefox => 75.0 (64-bit)

有人可以帮我了解如何获得多个堆叠的通知吗？

谢谢

【参考方案1】：

我还在 Twitter 上与@gauntface 取得了联系，在他的帮助下，我得以解决此问题。

Here is the Twitter thread

这是解决方案

【讨论】：

您能否发布更新的代码以防 twitter 链接消失？

嘿尼克，代码保持不变。只是警报在 Mac 上的显示方式发生了变化

知道了 - 我没有意识到图像中发生了什么。