Javascript 如何检测我的a网站/PWA已加载到前台？

我有一个用React编写的Ipad渐进式Web应用程序，我想检测用户在切换到另一个应用程序后何时重新加载该应用程序。是否有浏览器事件或SerService worker事件可以在重新加载应用程序时订阅

通过类似的线索，有没有一种方法可以判断渐进式web应用程序已被强制关闭并重新打开

谢谢

您可以使用来检测以前在后台的web应用现在在前台的时间：

document.addEventListener('visibilitychange', function() {
  if (document.visibilityState === 'visible') {
    // Your code here...
  }
});

中有关于页面生命周期API的更多信息，但您应该注意，并非API中的所有可用状态都在Safari中公开。文章列出了在编写跨多个浏览器工作的代码时要注意的事项。

您可以使用该库作为订阅页面生命周期事件的跨浏览器方法

从“页面生命周期”导入生命周期
addEventListener（'statechange'，（{oldState，newState}）=>{
console.log（`${oldState}->${newState}`）
})

在我的测试中，iOS PWA受到以下事件的限制：

• 关闭开关：激活→ 被动的，被动的→ 隐藏的
• 切换到：隐藏→ 被动的，被动的→ 活跃的
• 激活应用程序切换器并返回：无更改

---

我没有找到任何方法检测到应用程序被强制关闭并重新打开。

对于阅读此答案的任何人来说，页面生命周期库不是很稳定，维护也不好。我在生产中遇到了一些事故。我宁愿建议使用react页面可见性库。