如何使用Chrome检查Cookies？

Question

我正在测试通过JavaScript创建的一些cookie。是否有一种方法可以在Chrome开发者工具或类似工具中检查是否设置了cookie？

- Howdy_McGee

Answer 1

使用Chrome检查当前页面的Cookie：

选项1

1. 打开开发者工具（通常是F12）
2. 点击“应用程序”选项卡（曾经是“资源”）
3. 展开“Cookie”列表项
4. 单击任何列表项。

您可以在此处详细查看Cookie，并清除它们（单击Cookie下的任何列表项，然后单击表格左下角的取消图标）。

选项2

使用JavaScript控制台，例如document.cookie。视觉上不太复杂，但您可以使用JavaScript处理数据。请注意，结果将受到网站允许从其他网站访问本地数据的方式的限制（参见MDN同源策略）。

选项3

还有chrome://settings/siteData（之前是设置/cookie）。只需将URL放入Chrome的地址字段即可。

- AlexMA

---

在最近的开发者工具版本中，该选项卡被称为“应用程序”。 - Alf Kåre Lefdal

这已经过时了。更新的位置在这里：https://dev59.com/xmkw5IYBdhLWcg3wQ4Zc#48083367 - Joseph Cho

为什么 document.cookie 中没有一些 cookie，但我可以在 chrome://settings/siteData 中看到它们？！！！ - Nabi K.A.Z.

@NabiK.A.Z. 可能是 Chrome 显示了来自不同域的 cookie。请参阅“同源策略”。 - AlexMA

@AlexMA 不是的，问题似乎是由于 HTTP Only cookie 选项引起的，但该站点在 HTTPS 上打开。 但是我无法通过 js 在控制台中看到同一域上 HTTPS 的 cookies！ - Nabi K.A.Z.

@NabiK.A.Z. 在cookie上使用HttpOnly标签有些误导，但它并不意味着cookie仅在http协议（而非https）下发送。HttpOnly cookie的含义是它由浏览器发送，但JS无法访问它。这与cookie上的Secure标签不同，后者意味着浏览器仅将其发送到使用https协议的站点（但它对cookie在JS中的可见性没有影响）。在此链接有一个好的描述：https://developer.mozilla.org/zh-CN/docs/Web/HTTP/Cookies。 - Chris Rice

Answer 2

在控制台中输入 document.cookie，它会返回该页面的活动 cookie。

- Nick Beranek

---

在过去的一周里，我开始意识到JS控制台有多棒了！谢谢！ - Howdy_McGee

在Linux中，JS控制台只需按下[CTRL]+[Shift]+i键，然后点击“控制台”选项卡即可访问。 - psiphi75

@DaFi4 是的，我也有这个问题。document.cookie 不包含某些 cookie，但我可以在 chrome://settings/siteData 中看到它们！！！ - Nabi K.A.Z.

它将返回该页面的活动cookie。- 这对我有用，谢谢。 - Subham Tripathi

Answer 3

另一种方法是输入以下内容：

chrome://settings/cookies

在地址栏中输入网址。

然后使用左键点击以查看更多细节（内容、过期日期等）。

- ROMANIA_engineer

Answer 4

Chrome最新版本（v52）已将此功能移至“应用程序”选项卡。 因此，更新的步骤如下：

1. 打开开发者工具
2. 单击“应用程序”选项卡
3. 在左侧侧边栏的“存储”列表项下列出了Cookie

- quicklikerabbit

Answer 5

在最新版本的Chrome浏览器（Chrome v85）中，URL地址为：

chrome://settings/siteData

- Joseph Cho

Answer 6

在Chrome 61版本中：

chrome://settings/content/cookies
是关于Cookie设置的页面。

- Ari

Answer 7

您还可以使用Web开发工具，不仅可以帮助您查看Cookie，还可以帮助您单独显示、删除（会话、域、路径）Cookie。

- kamal