DevTools Storage 调试
用 Application 面板检查 localStorage、sessionStorage 和站点本地状态,是前端状态错乱问题的常见排障入口。
#type / concept
#status / growing
#tech / dev / frontend
#platform / browser
#resource / chrome-devtools
[!info] related notes
- 所属 MOC: DevTools Application MOC
- 前置概念: 浏览器客户端存储, Cookie 与 LocalStorage
- 并列概念: Cookie 调试, IndexedDB 与 Cache Storage 调试
- 关系笔记: Application 面板, 登录态异常排查路线
DevTools Storage 调试
一句话定义
Storage 调试是检查站点在 localStorage 和 sessionStorage 里保存了什么状态,以及这些状态是不是脏了、旧了、错了。
核心内容
常见场景
- 页面总读到旧配置
- 多账号切换后状态串了
- 某个 UI 状态明明重置了却又被本地数据恢复回来
常见动作
- 看具体 key 和 value
- 对照刷新前后状态变化
- 清理单项或整站点状态验证推断
边界与易混淆点
- localStorage / sessionStorage 是前端状态存储,不会自动随请求发送
- “本地状态不对”不一定是存储问题,也可能是应用启动逻辑又把旧值写回去了