JS中无法从document.cookie访问cookies，但浏览器显示cookies存在

Posted 2023-03-08

【中文标题】JS中无法从document.cookie访问cookies，但浏览器显示cookies存在

【英文标题】：Can't access cookies from document.cookie in JS, but browser shows cookies exist

【发布时间】：2021-12-02 04:50:17

【问题描述】：

我无法从 javascript 访问任何 cookie。我需要读取一些值并通过 JSON 发送它们以进行自定义检查。

我尝试从 JS 访问 cookie，就像它在以下描述的那样：

http://www.w3schools.com/js/js_cookies.asp Get cookie by name

正如您在代码中看到的那样，它在下一个看起来像水晶一样清晰：

var c_value = document.cookie;

当我尝试从 Chrome 的网络调试器访问 document.cookie 值时，我在 Watch 表达式 中只看到空字符串：

所以我无法读取我需要的 cookie 值。

我检查了 cookie 名称，我发送该名称以获取关联值是正确的。 另外，如果您有兴趣，我正在使用 W3Schools 源代码获取 cookie（但从第二个链接来看，技术类似）。

如何解决我的问题？

【问题讨论】：

@PeeHaa 真的吗？我不知道。我在 ASP.NET MVC 4 (Razor) 项目下工作，不知道它是否支持默认启用此参数。不要生我的气 :) 我是网络开发的新手。

检查浏览器中的cookie，它应该会说它是否是httponly。

@PeeHaa 我已经检查过，如果 Chrome 的 webtools 的 cookie 查看器表中的 HTTP 列中有一个检查，那么这是否意味着我的 cookie 只是 HTTP？如果是，那么我的项目只使用 HTTP cookie，我不明白如何解决我的问题 :(

@PeeHaa 是的，我确实有这样的控制。 Cookie 由服务器端响应设置。我在我的 ASP.NET MVC4 项目中使用 C#。我设置 cookie 的部分：ideone.com/fBqtke

@PeeHaa 所以，你有什么建议，如何解决？我现在正在谷歌搜索。所有网站都建议使用document.cookie，Chrome 的网络工具在 Http 列下显示我所有的 cookie 和检查。为什么无法从document.cookie 访问？

【参考方案1】：

我多次遇到同样的问题。而且每次都是出于不同的原因。

不同的原因：

httpOnly 字段的问题。它设置为false，我试图从控制台访问它。将其设置为 true 或从源代码访问它就可以了。 secure 字段的问题。是true，我只使用http。 Expires / Max-Age 的问题。 cookie 已过时，在 document.cookie 中不可见。

【参考方案2】：

如果您使用某种安全身份验证，那么由于安全原因，您无法直接访问 cookie。您必须使用以下代码更改服务器端的一些响应属性。

Response.AddHeader("Set-Cookie", "CookieName=CookieValue; path=/;");
Response.SetCookie(new HttpCookie("session-id")  Value = Guid.NewGuid().ToString(), HttpOnly = false );
Response.SetCookie(new HttpCookie("user-name")  Value = data.Login, HttpOnly = false );

但你不应该因为它可能会改变安全到不安全，所以你必须找出在服务器端完成的解决方案来删除cookie并允许你做一些操作。

可以在服务器端进行更改。

【参考方案3】：

还要注意 cookie 的 Path 属性，因为 cookie 仅对 Path 下的子目录可见。我遇到了你的问题，我解决了设置路径“/”

【参考方案4】：

我会说 http only 是您的第一个罪魁祸首，但这也可能通过不设置 cookie 的范围而发生。

如果站点已从另一个域重定向，您将需要考虑设置 cookie 的范围。 Domain 和 Path 定义了 cookie 的范围，cookie 应该被发送到哪些 URL。根据这一点，您可能不会在响应中看到 cookie。

我在成功的 SAML SSO 登录设置 cookie 时遇到了这个问题，并且无法从文档中检索 cookie，因为它从未作为请求的一部分发送。

【参考方案5】：

如果您的 cookie 设置为 Set-Cookie 或 Set-Cookie2，则它不是响应标头集合的一部分：http://www.w3.org/TR/XMLHttpRequest/#the-getallresponseheaders%28%29-method

返回响应中的所有标头，字段名称为 Set-Cookie 或 Set-Cookie2 的标头除外。

【参考方案6】：

您很可能正在处理httponly cookie。 httponly 是您可以在 cookie 上设置的标志，表示 JavaScript 无法访问它们。这是为了防止恶意脚本窃取包含敏感数据甚至整个会话的 cookie。

因此，您要么必须禁用 httponly 标志，要么需要找到另一种方法将数据获取到您的 javascript。

通过查看您的代码，应该很容易禁用 http only 标志：

Response.AddHeader("Set-Cookie", "CookieName=CookieValue; path=/;");
Response.SetCookie(new HttpCookie("session-id")  Value = Guid.NewGuid().ToString(), HttpOnly = false );
Response.SetCookie(new HttpCookie("user-name")  Value = data.Login, HttpOnly = false );

现在您应该可以从 JavaScript 访问 cookie 信息了。但是我不确切知道您要获取什么样的数据，所以也许您可以采用另一种方法，例如使用您需要的信息在页面上呈现一些数据属性，而不是尝试读取 cookie：

<div id="example" data-info="whatever data you are trying to retrieve"></div>

console.log(document.getElementById('example').getAttribute('data-info'));