可通过Chrome开发者工具Application面板查看Cookie,支持结构化浏览、Console命令读取、关键词筛选及JSON导出。

如果您希望查看当前网页在Chrome浏览器中保存的Cookie数据,可以通过Chrome开发者工具直接访问并 inspect 相关信息。以下是具体操作步骤:
一、打开Chrome开发者工具并切换到Application面板
Chrome开发者工具中的Application面板专门用于查看和管理网站的存储数据,包括Cookies、LocalStorage、SessionStorage等。该面板提供结构化视图,便于定位和分析每个域名下的Cookie条目。
1、在Chrome浏览器中打开目标网页。
2、按下 F12 键或 Ctrl+Shift+I(Windows/Linux) / Cmd+Option+I(Mac)打开开发者工具。
3、点击顶部标签栏中的 Application 选项卡。
二、展开Cookies列表并查看具体条目
Application面板左侧的“Storage”区域下,“Cookies”节点会列出当前页面所属源(Origin)的所有Cookie。每个Cookie包含名称、值、域、路径、过期时间、大小及安全属性等关键字段,可用于调试登录状态或验证身份凭证是否正确写入。
1、在左侧边栏中,展开 Cookies 节点。
2、点击当前网页对应的完整URL(例如 https://example.com)。
3、右侧主区域将显示所有已存储的Cookie条目,每行包含 Name、Value、Domain、Path、Expires/Max-Age、Size、HttpOnly、Secure、SameSite 等列。
三、使用Console命令获取当前页面Cookie字符串
通过JavaScript执行环境可快速读取document.cookie返回的原始字符串格式Cookie内容。该方式适用于需要复制原始键值对或进行简单脚本处理的场景,但仅能访问未标记HttpOnly的Cookie。
1、确保开发者工具处于 Console 面板。
2、输入并回车执行:document.cookie。
3、控制台将输出一个以分号分隔的字符串,例如:"sessionid=abc123; csrftoken=xyz789"。
四、筛选和搜索特定Cookie名称
当页面存在大量Cookie时,手动滚动查找效率较低。Application面板支持实时过滤功能,可通过输入关键词快速定位目标Cookie,提升调试效率。
1、在Application面板的Cookies列表上方,找到右上角的 Filter 输入框(图标为放大镜)。
2、输入要查找的Cookie名称关键字,例如 token 或 auth。
3、列表将自动高亮匹配项,并隐藏不相关条目。
五、导出Cookie数据用于离线分析
Chrome原生不提供直接导出Cookie为JSON或CSV的功能,但可通过Console执行脚本生成结构化数组,再手动复制结果至外部工具。该方法适用于需批量比对或日志归档的调试需求。
1、切换至 Console 面板。
2、粘贴并执行以下代码:
JSON.stringify(document.cookie.split('; ').map(s => { const [k, v] = s.split('='); return { name: k.trim(), value: v }; }), null, 2)
3、按回车后,控制台将输出格式化的JSON数组,可全选复制。










