3

有没有办法检测用户是否使用服务人员连接回网络/在线?

当用户回到网络时,我想获取一些数据。

它可能在 fetch 事件处理程序中完成,但我更喜欢不那么 hacky 的解决方案。

我想出了hacky解决方案的伪代码:

self.addEventListener('fetch', function(event) {
     event.respondWith(
         fetch(event.request)
              .then(function(res) {
                   // check previous status
                   // if previous status == offline, user is back online
                   // do back online stuff...
                   // set status to online if previous status is offline
              })
              .catch(function(err) {
                   // set status to offline
              })
        );
});
4

1 回答 1

4

您无法检测到 Service Worker 本身从离线状态返回在线状态的时刻(事件)。但是,如果您对此特别感兴趣,可以利用对象中的onlineoffline事件window。换句话说,您可以在页面上运行的常规 JavaScript 代码(不在 SW 中)中为这些事件添加事件侦听器,并且每当它们发生时,通过postMessage API. 这样页面上的 JS 会检测到在线/离线变化并通知 SW,之后 SW 可以将这些信息用于它想要的任何目的。

需要注意的一件事:如果浏览器关闭或用户没有查看页面,这些在线/离线事件不会触发,因为它们发生在页面的 JS 执行上下文中。这是设计使然:您不应该创建一个持续跟踪用户连接状态的 Service Worker。

正如其他人所指出的那样,取决于您真正感兴趣的内容(“连接更改何时发生”与“如何检查 SW 中是否在线/离线”),这可能是一个重复的问题,我建议您阅读链接回答。

根据您的要求,我想您想在客户端和服务器之间进行某种同步,不是吗?如果是这样,我建议您阅读Background Sync API至少受 Chrome 支持的内容,它可能会对您有所帮助。以下是使用 Workbox 库https://developers.google.com/web/tools/workbox/modules/workbox-background-sync的一些示例

于 2019-10-27T07:19:31.150 回答