服務人員顯示通知不起作用

Question

navigator.serviceWorker.register('/service-worker.js').then((reg) => {

})



Notification.requestPermission(function(result) {
    console.log('User Choice', result);
    if (result !== 'granted') {
      console.log('No notification permission granted!');
    } else {
        navigator.serviceWorker.ready
        .then(function(swreg) {
            console.log("blaxblux");
          swreg.showNotification('Successfully subscribed!', {body:'TEST'});
        });
    }
  });

這是我在main.js代碼

它涉及到console.log('blaxblux') ，但根本不顯示通知。 請求權限在瀏覽器顯示帶有允許按鈕的彈出窗口時起作用。

什么事情可能是問題？

（我使用的是最新版本的 chrome）

Answer 1

我遇到了類似的問題，但在我的 Windows 機器上為 Google Chrome 關閉了通知。 我繼續啟用通知，他們神奇地開始工作。

Settings -> System -> Notifications & Actions

向下滾動到“從這些發件人處獲取通知”部分並確認“Google Chrome”（或您的首選瀏覽器）設置為“開啟”

Answer 2

也許這篇文章可以幫助https://developers.google.com/web/fundamentals/push-notifications/subscribing-a-user#requesting_permission

最近獲取權限的 API 從接受回調更改為返回 Promise。 這樣做的問題是，我們無法判斷當前瀏覽器實現了哪個版本的 API，因此您必須同時實現並處理兩者。

function askPermission() {
  return new Promise(function(resolve, reject) {
    const permissionResult = Notification.requestPermission(function(result) {
      resolve(result);
    });

    if (permissionResult) {
      permissionResult.then(resolve, reject);
    }
  })
  .then(function(permissionResult) {
    if (permissionResult !== 'granted') {
      throw new Error('We weren\'t granted permission.');
    }
  });
}

Answer 3

這最初是由 Asaf 提出的，但我認為值得一提。

Windows 有一個“Focus Assist”，可以隱藏 Chrome 通知。 關閉它的完整指南在這里： https : //www.howtogeek.com/435349/how-to-disable-windows-10s-annoying-focus-assist-notifications/

快速的只是搜索“焦點輔助”，然后將其關閉。