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

Posted

技术标签:

【中文标题】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-CookieSet-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'));

【讨论】:

以上是关于JS中无法从document.cookie访问cookies,但浏览器显示cookies存在的主要内容,如果未能解决你的问题,请参考以下文章

无法访问客户端的cookie | NodeJS和JS

JS中document.cookie详解

js中如何设置cookie的保存时间呢?

vue中js-cookie中怎么销毁所有的cookie

无法访问 iframe 中加载的自己域上的 httponly 标记 cookie

js 操作cookie,getCookie,setCookie ,removeCookie