如何在 JavaScript 会话 cookie 中存储变量？答案

【问题标题】：How to store a variable inside a JavaScript session cookie?如何在 JavaScript 会话 cookie 中存储变量？
【发布时间】：2016-10-31 22:50:58
【问题描述】：

我想跟踪用户在我的项目网站上的所有页面上花费了多少秒，为此我想使用 JavaScript 会话 cookie。
这是因为我将使用我无法访问 PHP 的 Github Pages 来托管它，还因为我想尝试使用 JS cookie（这是我第一次这样做）。
要计算我使用以下内容的秒数：

var time_spent = 0;
setInterval(function(){
    ++time_spent;
    $('#counter_container span').html(time_spent);
}, 1000);

上面的代码在计数器所在的地方工作，但正如预期的那样，每次我更改页面时都会重置。
我尝试以下列方式使用 js-cookie 库 (https://github.com/js-cookie/js-cookie)：

Cookies.set('time_spent', time_spent);
var counted_time = Cookies.get('time_spent');
console.log(counted_time);

但无论我尝试过什么，counted_time 变量总是“未定义”。
为了解决这个小问题，我真的很感激我能得到的任何指导。

【问题讨论】：

仅供参考：setTimeout 不是跟踪时间的好方法。以及为什么不起作用，更新值时在哪里设置cookie？
我不会为此使用计时器。而是尝试在用户进入页面时设置一个时间戳，然后onbeforeunload获取持续时间并将其添加到cookie中存储的值中
Set cookie and get cookie with JavaScript的可能重复
@epascarello 我使用 setInterval 是因为这是我现在知道自己要做的少数事情之一，并且认为它可以在这里达到我的目的。感谢您澄清这不是跟踪时间和设置 cookie 的好方法，在我使用 setInterval 之前完成。对于我缺乏知识，我深表歉意。

标签： javascript jquery session cookies

【解决方案1】：

我不会为此使用计时器。而是尝试在用户进入页面时设置时间戳，然后onbeforeunload 获取持续时间并将其添加到存储在 cookie 中的值中。像这样的：

var load = new Date();

window.onbeforeunload = function() {
    var leave = new Date();
    var duration = leave.getTime() - load.getTime() / 1000;
    var counted_time = parseFloat(Cookies.get('time_spent')) || 0;
    Cookies.set('time_spent', counted_time + duration);
}

Working example

【讨论】：

感谢您的回答，尤其是工作示例。在您的帮助下，我能够完成我所拥有的一切，并且还在路上学到了一些新东西。