javascript - Chrome 上不一致/延迟的 HTML5 桌面推送通知

Question

我正在编写一个聊天网络应用程序，它需要能够通过通知 API 触发桌面推送通知:https://developer.mozilla.org/en-US/docs/Web/API/Notifications_API

不幸的是，直到我用这个 fiddle 发出另一个通知将其全部清除之前，通知似乎没有显示:https://jsfiddle.net/yoshi6jp/Umc9A/

这是我正在使用的代码:

function triggerDesktopNotification() {
  function makeNotification() {
    var notification = new Notification('AppName', {
      body: 'You have a new message!',
      icon: '/favicon.ico',
    });
    notification.onclick = () => {
      notification.close();
    };
  }

  if (Notification.permission === 'granted') {
    makeNotification();
  }
  else if (Notification.permission !== 'denied') {
    Notification.requestPermission(function (permission) {
      if (permission === 'granted') {
        makeNotification();
      }
    });
  }
}

我可以通过在 new Notification 调用之后立即放置 console.log() 来确认代码是否正确执行。有趣的是，如果我将 alert() 放在那里，通知会在我看到警告框时显示(在导航回我的选项卡后)。

Answer 1

如果我没理解错的话；

Alert 会中断程序堆栈，我认为它所在的位置。您为什么不尝试像那样使用 setTimeout 函数异步触发它？

 setTimeout(  function(){
       alert("asd");
     })

编辑 js fiddle here