静态站点的 Cookie：Cookie 将很快被拒绝（SameSite）问题答案

【问题标题】：Cookies for static site: Cookie will be soon rejected(SameSite) issue静态站点的 Cookie：Cookie 将很快被拒绝（SameSite）问题
【发布时间】：2020-11-12 11:00:07
【问题描述】：

我正在创建一个静态网站（将在 github 页面上发布）并希望使用 cookie 为用户存储网站状态。但是在设置 cookie 时出现以下错误：

Cookie“buttonState”将很快被拒绝，因为它的“sameSite”属性设置为“none”或无效值，没有“secure”属性。要了解有关“sameSite”属性的更多信息，请阅读https://developer.mozilla.org/docs/Web/HTTP/Headers/Set-Cookie/SameSite

我一直在使用下面的js代码来设置cookies：

function set_cookies(jsonObj={},expires="",path="/"){
for(var key in jsonObj){
    var temp = (key+"="+jsonObj[key]+";");
    if(expires!=="")
        temp += ("expires="+expires+";");
    if(path!=="")
        temp+= ("path="+path);
    console.log(temp);
    document.cookie = temp;
  }
}
set_cookies({"buttonState":"compile");

我该如何解决这个问题？

【问题讨论】：

Localstorage 不是一个选项吗？
@JohnPavek Localstorage 存在过期问题。我希望状态每 2 天过期一次。

标签： javascript cookies github-pages samesite static-pages

【解决方案1】：

我也一直在我们网站上的 cookie 上处理这个问题。您需要将 ";sameSite=Lax" 附加到您的临时变量。这就是浏览器现在期望看到的。根据您提供的链接，Mozilla 文档说，Lax 的定义是：

"允许通过顶级导航发送 Cookie，并将与第三方网站发起的 GET 请求一起发送。这是现代浏览器的默认值。”

后来，在“无”下，它说：

"None 曾经是默认值，但最近的浏览器版本放宽默认值以对某些情况进行合理稳健的防御跨站点请求伪造 (CSRF) 攻击的类别。”

后来，在其中一个例子下，它说：

“虽然您可以依靠现代浏览器来应用 SameSite=Lax 自动，您应该明确指定它以明确传达您的意图，哪些 SameSite 政策适用于您的 cookie。这也将改善跨浏览器的体验，因为并非所有它们还默认为 Lax。”

【讨论】：