javascript - 无法堆叠多个推送通知

Question

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

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)

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

谢谢

Answer 1

我还在 Twitter 上与 @gauntface 联系，在他的帮助下，我解决了这个问题。

Here is the Twitter thread

这是解决方案