"在前端超时后实现用户注销计时器"

Question

我想知道在前端实现计时器的最佳方式是什么。

这个想法是在 13 分钟不活动（= 未向后端发出请求）后通知用户他将在 2 分钟内注销。

我的第一次尝试是只使用每秒执行一次的Timer<\/code> （我正在使用 Flutter web 执行此操作，但它不应该有所作为）并从 15 分钟开始倒计时。

然后我们在内部对此进行了测试，并注意到如果用户长时间切换到不同的选项卡或计算机进入待机状态以使计时器停止，浏览器会以某种方式停止 JavaScript 执行。

我们已经在后台 15 分钟后有会话超时，这只是为了让用户体验更好。

这将如何正确实施？

Answer 1

简而言之，我认为只使用前端是不可能的

当您检查时，每当切换选项卡或关闭选项卡时，javascript 代码都会停止，计算机处于待机状态。 所以使用超时或类似的东西是不好的。

我之前使用了一个想法，但还没有实现它，因为我使用 sessionStorage 切换到了更简单的想法。 但是您可以看到并以某种方式成功：发出最后一个请求时，创建了一个过期时间为 13 分钟的 cookie。 如果发出下一个请求，请清除旧 cookie 并在 13 分钟内添加一个新 cookie。 如果在 13 分钟内没有发出请求，当 cookie 过期时，触发一个事件通知用户。 要监听 cookie 变化，我认为有很多解决方案。 但对我来说，这个想法不太好，所以我忘记了。

如果您可以使用 nodejs 后端，您可以尝试使用服务器发送事件 - SSE。 这将创建单向发送数据。 因此，您可以流式传输大量数据。 前端将监听该流并决定是否向用户宣布。