JavaScript中设置浏览器Cookie不生效问题求助（附代码）

先看你代码里最明显的问题——过期时间设置的是过去的日期！你写的expires=Fri, 17 Dec 2020 10:00:00 GMT，这个时间早就过了，浏览器会直接丢弃这个Cookie，根本不会保存。除了这个，还有几个常见坑需要排查：

• 过期时间错误：必须设置未来的时间，推荐用max-age（以秒为单位）更直观，比如max-age=31536000表示有效期1年；如果用expires，要确保是UTC格式的未来时间。
• 未指定Path属性：默认情况下，Cookie的路径是当前页面的路径，比如你在/about页面设置的Cookie，在首页可能看不到。加上path=/可以让整个站点的页面都能访问这个Cookie。
• HTTPS环境下缺少Secure属性：如果你的网站是HTTPS协议，浏览器可能会拒绝保存没有Secure属性的Cookie（仅在HTTPS连接下发送），可以加上;Secure。
• SameSite属性限制：现代浏览器对SameSite的默认策略可能阻止某些场景下的Cookie保存，比如跨域或嵌入场景。可以加上;SameSite=Lax（大部分场景适用），如果是跨域场景需要;SameSite=None;Secure。
• 代码执行中断：检查你的DOM操作部分有没有报错，比如某个元素不存在（getElementById返回null），导致代码没执行到设置Cookie的步骤？可以在document.cookie那行前面加console.log("Setting cookie for:", p_lang)，看看控制台有没有输出，确认代码是否执行到这里。

给你修改后的示例代码，修复了过期时间和路径问题：

function setValue(p_lang) {
  // 设置1年后过期、全站可用的Cookie
  const oneYearLater = new Date();
  oneYearLater.setFullYear(oneYearLater.getFullYear() + 1);
  
  document.cookie = `lg=${p_lang};expires=${oneYearLater.toUTCString()};path=/`;

  if (p_lang === "en") {
    document.getElementById("home").innerHTML = MenuEng[0];
    document.getElementById("about").innerHTML = MenuEng[1];
    document.getElementById("contact").innerHTML = MenuEng[2];
  } else if (p_lang === "az") {
    document.getElementById("home").innerHTML = MenuAze[0];
    document.getElementById("about").innerHTML = MenuAze[1];
    // 补充剩余的DOM操作
  }
}

调试小技巧：打开浏览器开发者工具（F12），切换到「Application」（Chrome）或「Storage」（Firefox）面板，查看「Cookies」下的站点域名，确认Cookie是否被正确添加；同时看「Console」面板有没有报错信息。

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