如果在 2 个浏览器选项卡上，Angularjs 通知显示两次

Posted 2023-02-24

【中文标题】如果在 2 个浏览器选项卡上，Angularjs 通知显示两次

【英文标题】：Angularjs notification showing twice if on 2 browser tabs

【发布时间】：2020-09-28 07:13:26

【问题描述】：

我正在使用 angular-web-notification 。我的问题是，如果我打开 2 个浏览器选项卡然后收到消息，我会看到显示的两个通知实例。

下面是参考代码。

    webNotification.showNotification(title, 
        body: body,
        onClick: function onNotificationClicked() 
            console.log('Notification clicked.');
        ,
        icon: 'icon.png'
    , function onShow(error, hide) 
        if (error) 
            console.log('Unable to show notification: ' + error.message);
         else 
            console.log('Notification Shown.');
        
    );

你有什么想法吗？

【参考方案1】：

为了防止任何重复的通知使用标签

Notification.tag 通知ID https://developer.mozilla.org/en-US/docs/Web/API/notification

 webNotification.showNotification(title, 
        body: body,
        tag:"some custom unique tag per notification"
        onClick: function onNotificationClicked() 
            console.log('Notification clicked.');
        ,
        icon: 'icon.png'
    , function onShow(error, hide) 
        if (error) 
            console.log('Unable to show notification: ' + error.message);
         else 
            console.log('Notification Shown.');
        
    );

【讨论】：

谢谢@Aian 你能解释一下命名标签的方法吗？

[...Array(30)].map(() => Math.random().toString(36)[2]).join('') 你可以使用任何随机字符串当您发送通知时，顺便说一句，标签应该生成服务器端（我假设您从服务器发送通知）与（标题，正文）来的相同来源

再次感谢@Aian

【参考方案2】：

在我的情况下，我收到了两次推送通知，但我之前解决了这个问题。 目前，我有一个问题要问你，你使用 fcm 吗？

【讨论】：

不，我使用 websocket。

你能解释一下你的解决方案吗？

嗨！请解释您的解决方案，而不是提出问题，这对我们所有人都会更有用。谢谢！