通知未显示,通知API

时间:2019-03-30 20:46:00

标签: javascript html5 notifications

使用通知API创建通知时,不会显示通知。

我最近试图使用通知api来创建一个简单的通知并显示它。最终,我打算在正在构建的应用程序中使用通知。请求权限步骤进行得很顺利,但是当我创建通知时,它根本没有显示。

我知道我的浏览器支持通知api,但我没有阻止它们。我也不在使用移动设备,而是在使用最新版本的chrome。这些通知不会显示在任何地方,包括使用ssh加密的网站。

这是我的代码:

async function notify(data) {
  function createNotification(data) {
    const notification = new Notification(data.title, {
      icon: data.icon,
      body: data.body
    })

    return notification
  }

  function checkNotifications() {
    if(Notification) {
      return true
    } else {
      alert('Notifications are not supported on this browser.')
      return false
    }
  }

  if(checkNotifications()) {
    if(Notification.permission === 'granted') {
      createNotification(data)
    } else {
      if(await Notification.requestPermission() === 'granted') {
        console.log(createNotification(data))
      } else {
        alert('you will not recive notifications')
      }
    }
  }
}

notify({title: 'test', body: '<b>hello</b>', icon: '../logo.png'})

这是我的html:

<!DOCTYPE html>
<html>
  <head>
    <title>website</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
  </head>
  <body>

    <script type='text/javascript' src='./notification.js'></script>
  </body>
</html>

预期结果:

显示通知

实际结果:

没有错误,但也没有通知。

编辑:

如果我将通知设置为“允许”而不是“询问”,则通知有效。

2 个答案:

答案 0 :(得分:0)

清单中有这个吗?

"permissions": [
          "contentSettings"
        ],

然后在您的脚本中...

chrome.contentSettings.notifications.set({primaryPattern:'<all_urls>',setting:'allow'});

抱歉,您是服务器端还是客户端?

https://developer.chrome.com/extensions/contentSettings

答案 1 :(得分:0)

检查您的 Windows 设置是否启用了通知。

https://support.microsoft.com/en-us/windows/change-notification-settings-in-windows-10-ddcbbcd4-0a02-f6e4-fe14-6766d850f294

https://support.microsoft.com/en-us/windows/change-notification-and-action-settings-in-windows-10-8942c744-6198-fe56-4639-34320cf9444e

开始 > 设置 > 系统 > 通知和操作

您也可以点击屏幕右下角的通知中心,然后点击管理通知。您可能启用了它们,但您也可能阻止了基于 chrome 的那些。