Question

假设我有一个定时器，用户点击按钮即可激活，如何在用户关闭浏览器之前保存数据（当前定时器状态和数据），并在用户访问同一页面后恢复定时器，记录两次会议之间的经过时间。

我的开发基于ASP.NET MVC4，大多数情况下我使用ajax调用来为用户交互提供服务。

我正在考虑是否有办法可以通过服务器端代码控制这种交互和需求，但我对此持怀疑态度。

你的想法是什么？

Answer 1

可以使用cookie在客户端完成。

以下是流程：

创建一个计时器
为浏览器关闭事件添加事件处理程序（查看此处How to capture browser close event?）
获取计时器的剩余时间（此处可以找到说明find the time left in a setTimeout()?）
使用该信息编写cookie
在页面上加载检查是否存在带有剩余时间信息的cookie并使用setTimeout重新创建具有剩余时间的计时器

我将尝试使用更多代码示例来更新此帖子。

<强>更新

var timeLeft= $.cookies('timeLeft') || ORIGINAL_VALUE;
var timer = setTimeout(myFunc, timeLeft);
$(window).unload(function(){
  var timeLeftToSave = getTimeLeft(timer);
  $.cookies('timeLeft', timeLeftToSave, { path: '/' });
})

//Use code from the second link here
function getTimeLeft(timer){

}



function myFunc(){/*YOUR CODE HERE*/}

Answer 2

您可以尝试使用unload事件中的当前值创建Cookie，然后在再次启动计时器时检查这一点吗？

$(window).unload(function() {
    // Set a cookie with current timer value
});

查看here，了解有关在Javascript中设置Cookie的信息。

Answer 3

我建议编写一些客户端Javascript来检测onunload和onbeforeunload事件，并将计时器的值存储在用户浏览器的本地存储中。

为了处理本地存储，我建议使用一个优秀的库：LawnchairJS。来自相关的documentation：

默认情况下，Lawnchair将继续使用DOM存储，但如果是其他适配器可用，并且不支持DOM存储目前正在执行JavaScript运行时Lawnchair将尝试各自连续适配器，直到它找到一个有效的。

如何在浏览器会话关闭后恢复客户端计时器？

3 个答案: