如何查看浏览器中当前存储的 Cookie？

如何查看浏览器中的 Cookie为什么有些 Cookie 看不到1. 引言快递单号与隐私信封2. Cookie 是什么小白必备3. 核心问题为什么有些 Cookie“看不到”4. 如何查看 Cookie三种主要方法4.1 方法一浏览器开发者工具最推荐能看到所有 CookieChrome / EdgeFirefoxSafari4.2 方法二JavaScript 快速查看有限制4.3 方法三浏览器设置面板管理存储5. 方法对比表6. 常见误区7. 实战建议8. 总结1. 引言快递单号与隐私信封想象你寄了一个包裹快递单上写着收件人地址Cookie 名和你的电话Cookie 值。如果你把单号写在快递盒外任何人都能看到。但如果用隐私信封HttpOnly封起来快递员能扫描到但路边的人看不到。浏览器中的 Cookie 也是这样有些是公开的有些被特意隐藏了。本文将教你如何查看浏览器中存储的所有 Cookie并解释为什么有些 Cookie“看不见”。2. Cookie 是什么小白必备Cookie是网站存储在浏览器里的一小段文本数据通常用于记录登录状态、用户偏好等。浏览器会在每次请求时自动携带符合条件的 Cookie帮助服务器识别用户。每个 Cookie 包含多个属性Name / Value键值对存储具体数据。Domain / Path决定哪些请求会携带这个 Cookie。Expires / Max-Age控制 Cookie 存活时间。HttpOnly如果为trueJavaScript 无法读取该 Cookie。Secure如果为true仅通过 HTTPS 传输。3. 核心问题为什么有些 Cookie“看不到”如果你在浏览器的开发者工具里能看到一个 Cookie但用document.cookie却读不到很可能是因为它被设置了HttpOnly属性。HttpOnly的作用告诉浏览器“这个 Cookie 只能由 HTTP 请求携带禁止 JavaScript 读取”。这是为了防止 XSS 攻击窃取敏感信息如 Session ID。常见场景登录后的JSESSIONID或PHPSESSID通常都会设置HttpOnly因此你无法通过document.cookie看到它们。4. 如何查看 Cookie三种主要方法4.1 方法一浏览器开发者工具最推荐能看到所有 Cookie无论 Cookie 是否设置了HttpOnly开发者工具都能看到。不同浏览器的操作略有差异Chrome / Edge打开目标网站。按F12打开开发者工具。点击Application标签页。左侧菜单找到Storage → Cookies展开后点击当前域名如https://example.com。右侧表格显示所有 Cookie包含Name、Value、Domain、Path、HttpOnly、Secure等属性。小技巧右键点击某一行可以复制 Cookie 的值或直接删除它。Firefox按F12打开开发者工具。点击存储标签页。左侧选择Cookie展开域名即可查看。Safari先在菜单栏启用“开发”菜单偏好设置 → 高级 → 勾选“在菜单栏中显示‘开发’菜单”。菜单栏选择开发 → 显示 Web 检查器。点击存储标签页选择 Cookies。4.2 方法二JavaScript 快速查看有限制在浏览器控制台中输入console.log(document.cookie);特点只能看到没有设置HttpOnly的 Cookie。输出的是一串用分号分隔的键值对如name1value1; name2value2。适合快速调试自己添加的普通 Cookie。4.3 方法三浏览器设置面板管理存储这种方式可以查看某个域名下存了多少 Cookie但不显示具体值。Chrome地址栏输入chrome://settings/content/all搜索域名点击“删除”或查看详情。Firefox菜单栏 → 选项 → 隐私与安全 → Cookie 和站点数据 → 管理数据。5. 方法对比表方法能否看到HttpOnly能否看到具体值适用场景开发者工具Application✅ 能✅ 能调试所有 Cookie推荐首选document.cookie❌ 不能✅ 能仅非 HttpOnly快速查看自己添加的非敏感 Cookie浏览器设置面板✅ 能❌ 不能仅统计批量清理 Cookie6. 常见误区误区正解“用document.cookie看不到的 Cookie 就是没存上”❌ 可能是HttpOnly隐藏了去开发者工具看。“所有 Cookie 都能通过 JavaScript 删除”❌HttpOnly的 Cookie 无法通过 JS 删除只能通过服务端设置过期或浏览器手动清除。“无痕模式下的 Cookie 开发者工具也看不到”❌ 仍可看到但关闭窗口后自动消失。7. 实战建议调试登录态问题优先用开发者工具检查HttpOnly的 Session Cookie 是否存在、过期时间是否合理。验证HttpOnly配置如果希望 Cookie 不被 JS 读取确认服务端设置了HttpOnly如果需要 JS 读取如存储非敏感的用户偏好则不要设置。排查跨域问题查看Domain和Path是否匹配当前请求。8. 总结目标推荐方法查看所有 Cookie含HttpOnly开发者工具Application / 存储快速查看非敏感 Cookiedocument.cookie批量清理 Cookie浏览器设置面板一句话记住HttpOnly的 Cookie 就像“隐私快递单”——快递员服务器能扫描但路人JavaScript看不见。想彻底看清所有 Cookie就用开发者工具的 Application 面板。