如何在JavaScript中设置并获取含时间戳的Cookie值

我帮你调整了代码，实现了设置Cookie时加入时间戳，并且能正确获取这个时间戳的功能。先看完整的修改后代码：

<!DOCTYPE html>
<html>
<body>
  <input type="button" value="Set cookie" onclick="tick()">
  <input type="button" value="Get cookie" onclick="idletimmer()">

  <script>
    function tick() {
      var username = "time_tick";
      setCookie("name", username);
    }

    function setCookie(name, value) {
      alert("Setting cookie...");
      // 获取当前时间戳（毫秒级，更精准）
      const timestamp = Date.now();
      // 用|分隔原始值和时间戳，避免和业务值冲突
      const cookieValue = `${value}|${timestamp}`;
      
      var date = new Date();
      // 保留你原本设置的50秒过期时间
      date.setTime(date.getTime() + (50 * 1000));
      var expires = "; expires=" + date.toGMTString();
      document.cookie = `${name}=${cookieValue}${expires}; path=/`;
      alert(`Cookie已设置: ${document.cookie}`);
    }

    function idletimmer() {
      // 修正定时器时间为10秒（原代码写的1000000是16分钟，不是10秒）
      t = setTimeout(idletimmer, 10000);
      // 传入要获取的Cookie键名
      getCookie("name");
    }

    function getCookie(name) {
      var readCookies = document.cookie;
      var splitCookies = readCookies.split("; ");
      alert(`当前所有Cookie: ${readCookies}`);
      
      for (let i = 0; i < splitCookies.length; i++) {
        // 解构拆分键和值，比原代码更清晰
        var [cookieName, cookieValue] = splitCookies[i].split("=");
        // 匹配目标Cookie
        if (cookieName === name) {
          // 拆分出原始值和时间戳
          const [originalValue, timestamp] = cookieValue.split("|");
          // 把时间戳转成可读日期格式展示
          alert(`找到目标Cookie:\n键名: ${name}\n原始值: ${originalValue}\n时间戳: ${timestamp}\n设置时间: ${new Date(parseInt(timestamp))}`);
          return;
        }
      }
      alert(`未找到名为"${name}"的Cookie`);
    }
  </script>
</body>
</html>

关键修改说明： #

• 时间戳存储逻辑：我选择把原始值和时间戳用|拼接后存入同一个Cookie，这样不需要额外创建Cookie键，结构更紧凑。如果你希望时间戳单独存在一个Cookie（比如name_timestamp），可以在setCookie里多添加一行：document.cookie = ${name}_timestamp=${timestamp}${expires}; path=/``，然后在getCookie里同时获取这两个Cookie即可。
• 修复原代码的错误：原getCookie里的if(value[i]=="time_tick")逻辑完全错误——value是当前Cookie的键值数组，value[0]才是键名，而且循环变量i和value的索引无关，现在改成解构赋值后逻辑更清晰。
• 修正定时器时间：原代码里的1000000毫秒是16分钟左右，不是你注释里写的10秒，已经改成10000毫秒（10秒）。
• 时间戳可读性优化：获取到时间戳后，可以通过new Date(parseInt(timestamp))转换成人类可读的日期时间格式，方便调试和使用。

内容的提问来源于stack exchange，提问作者Jasmine Joseph