Question

我必须在桌面和移动浏览器上显示通知。我试图创建以下功能。

<script>

function registerServiceWorker() {
    return navigator.serviceWorker.register('sw.js?v=12')
    .then(function(registration) {
      console.log('Service worker successfully registered.');
      return registration;
    })
    .catch(function(err) {
      console.error('Unable to register service worker.', err);
    });
  }
function displayNotification()
{
//alert(Notification.permission);
        if(window.Notification && Notification.permission !== "denied") {
        Notification.requestPermission(function(permission) { 

        navigator.serviceWorker.ready.then(function(reg)
        {
        console.log(reg);
var options = {
    body: 'You have 1 new notification in Funafuti community.',
icon: '/images/icon.png',
vibrate: [100,50,100],
"badge": "/img/favicon-32x32.png",
data: { primaryKey:1 } ,
tag: "notificationid",
actions: [
        {
          action: 'check-action',
          title: 'Check',
          icon: '/images/popuparrow.png'
        },
        {
          action: 'cancel-action',
          title: 'Ignore',
          icon: '/images/popuparrow.png'
        }
        ]
   };
            var n=reg.showNotification('Notification',options);

        });
        });
        }

}

 displayNotification();
 registerServiceWorker();
</script>

/ ------------------------------------------- --------------------------- / sw.js代码：

<script>
self.addEventListener('notificationclick', function(event) {
  if (!event.action) {
    // Was a normal notification click
    console.log('Notification Click.');
    return;
  }

  switch (event.action) {
    case 'check-action':
     window.focus();
        event.notification.close();
      console.log('User  coffee.');
      break;
    case 'cancel-action':
     event.notification.close();
      console.log('User  doughnuts.');
      break;
    default:
      console.log(`Unknown action clicked: '${event.action}'`);
      break;
  }
});
self.addEventListener('notificationclick', function(event) {
  event.notification.close();
});
</script>

通知在移动浏览器和桌面设备上都运行良好，但点击通知操作后没有任何反应。

我在notificationclick上使用addEventListener但仍无效。

你能帮我解决一下这个问题。我忘记了此代码中的任何通知点击。

提前致谢 Balraj

Answer 1

我遇到了同样的问题。您可以检查一下您的机器是否有重点帮助。我戴上了，但没有用。我将其关闭，现在可以正常使用了。

服务工作者通知单击不起作用

1 个答案: