javascript-从Service Worker检查窗口是否处于活动状态

我正在尝试运行一个Web应用程序,该应用程序在窗口处于非活动状态时发送推送通知.为此,我有一个服务人员,可以帮助从我的php服务器(通过Firebase)接收通知.

但是,我不确定如何通过我的Service worker检查窗口是否处于活动状态. Service Worker无权访问DOM,因此我无法直接通过DOM对其进行检查,并且我尝试对附加的JS文件进行检查,但是Service Worker收到了变量未定义的错误.我的服务工作者代码如下：

self.addEventListener('push', function(event) {
  console.log('[Service Worker] Push Received.');
  // console.log(`[Service Worker] Push had this data: "${event.data.text()}"`);

  const title = 'Chat';
  const options = {
    body: 'New message received!',
    icon: '/images/logo/8-icon.png',
    badge: '/images/badge.png'
  };

  event.waitUntil(self.registration.showNotification(title, options));

});

self.addEventListener('notificationclick', function(event) {
  console.log('[Service Worker] Notification click Received.');

  event.notification.close();

  event.waitUntil(
    clients.openWindow('https://localhost:8000')
  );
});

如果网络应用处于活动状态,有人可以启发我检查是否有活动窗口以阻止推送通知的正确方法吗？

谢谢！

解决方法:

您可以使用可见性API->
https://developer.mozilla.org/en-US/docs/Web/API/Page_Visibility_API?redirectlocale=en-US&redirectslug=DOM%2FUsing_the_Page_Visibility_API

在主页上附加一个事件侦听器,以与您的服务人员对话.然后,服务人员可以相应地执行.

标签：dom,push-notification,service-worker,javascript,php
来源： https://codeday.me/bug/20191111/2017878.html