在用户更改网页时跟踪时间

Question

我有一个要求，即用户按下开始计时器按钮并开始跟踪时间。当用户浏览网站时，我希望有时间继续跟踪，直到他们按下停止按钮。

显然，这不能仅通过客户端javascript来实现，因为每个页面的刷新时间都会丢失。我认为一个解决方案是使用faye / websockets将时间推到浏览器，但是每过一次就会将数据推送到客户端 - 这会对服务器造成压力。

我能想到的唯一解决方案是跟踪javascript中的时间，然后捕获页面卸载事件发送，ajax请求到服务器的时间量，并让服务器继续递增时间，直到下一页是完全读取。这意味着它不会使用推送技术，只是常规的ajax。这是最佳选择还是有更好的解决方案？

Answer 1

用户杀死浏览器的情况如何？在这种情况下，您将无法捕获卸载事件。

如果您需要客户端解决方案，请尝试将开始时间放在localStorage中，这将在页面加载中保持不变。然后，当用户点击停止时，您可以使用已用时间对服务器进行ajax调用。

Answer 2

我假设您需要向用户显示一个计时器，该计时器每秒更新一次。

我已经构建了这样的Web应用程序。它是一个单页面应用程序（AngularJS），因此用户可以从“页面”导航到“页面”，而无需加载完整的网页并且计时器保持运行。在你的情况下，这会是一个选择吗？

否则，您可以将开始时间放在cookie中，每秒显示当前时间和开始时间之间的差异。

其他一些选项，不太受欢迎：

1. 在iframe中运行网站，并将计时器保留在iframe之外。
2. 让计时器在服务器上运行并每秒向服务器发出一个小的AJAX请求（是的，我知道......）。
3. 混合：让计时器在服务器和客户端上运行，并在每次加载页面时将客户端与服务器同步。

选项2和3需要有状态服务器（具有所有缺点）。