无需登录 数据私有 本地保存

浏览器存储空间分析器 - localStorage/Cache

14
0
0
0
localStorage
--
0 个键值对
已用 0%(参考上限 ~5-10MB)
sessionStorage
--
0 个键值对
会话级别 · 关闭标签页即清除
Cache API
--
0 个缓存库
检测中...
总存储配额
--
配额 --
含 localStorage + IndexedDB + Cache 等
localStorage 详细数据 0
# 键名 值(预览) 大小 类型 操作

localStorage 为空

sessionStorage 详细数据 0
# 键名 值(预览) 大小 类型 操作

sessionStorage 为空

Cache API 存储 0
# 缓存名称 条目数 预估大小 状态 操作

Cache API 不可用或为空

(需要 HTTPS 或 localhost 环境)

Cookie 信息 0
仅显示非 HttpOnly 的 Cookie
# 名称 值(截断) 大小 Domain

无可读取的 Cookie

常见问题与知识点

localStorage:数据持久化存储,即使关闭浏览器或重启电脑后数据依然存在,没有过期时间,除非手动清除。同一域名下的所有页面共享数据。

sessionStorage:数据仅在当前会话期间有效,关闭标签页或浏览器窗口后数据即被清除。不同标签页之间的sessionStorage是隔离的,即使访问同一域名。

提示:二者存储上限通常为 5-10MB(因浏览器而异),且都只能存储字符串类型数据。

不同浏览器对localStorage的大小限制不同:

  • Chrome:约 10MB 每个域名(origin)
  • Firefox:约 10MB 每个域名
  • Safari:约 5MB 每个域名(隐私模式下可能更小)
  • Edge:约 10MB 每个域名

当存储空间不足时,浏览器会抛出 QuotaExceededError 异常。建议单个域名下localStorage使用量控制在5MB以内以确保兼容性。

Cache API 是 Service Worker 的一部分,允许开发者以编程方式缓存网络请求及其响应。它提供了精细的缓存控制能力,常用于PWA(渐进式Web应用)实现离线访问。

浏览器缓存(HTTP缓存) 是由浏览器自动管理的,基于HTTP头(如Cache-Control、ETag等)来决定是否缓存资源,开发者无法通过JavaScript直接操作。

Cache API需要HTTPS环境,存储配额通常比localStorage大得多,可达数百MB甚至更多,具体取决于磁盘空间。

清理浏览器存储的几种方式:

  1. 通过本工具:在表格中逐项删除或一键清空localStorage/sessionStorage/Cache。
  2. 浏览器开发者工具:F12 → Application → Storage → Clear site data。
  3. 浏览器设置:设置 → 隐私与安全 → 清除浏览数据 → 选择"Cookie和站点数据"。
  4. 代码方式localStorage.clear()sessionStorage.clear()

注意:清空操作不可逆!建议在清空前使用导出功能备份重要数据。

特性CookielocalStorage
存储容量约4KB约5-10MB
数据发送每次HTTP请求自动发送不自动发送
过期时间可设置过期时间永久有效(手动清除)
API易用性字符串解析较繁琐简洁的键值对API
HttpOnly支持(JS无法读取)不适用

localStorage适合存储较大的客户端数据;Cookie适合需要随请求发送的小数据(如认证令牌)。

现代浏览器使用Storage Quota Management API来管理站点存储空间:

  • navigator.storage.estimate() 可查询当前站点的已用空间(usage)配额(quota)
  • 配额包括localStorage、IndexedDB、Cache API、Service Worker等所有存储的总和。
  • Chrome采用"最佳努力"策略——站点可使用空间通常远大于标称配额,但浏览器可能在磁盘空间紧张时自动清理。
  • 持久化存储(Persistent Storage)可通过navigator.storage.persist()申请,获得更高的保留优先级。

配额因浏览器和磁盘空间而异,通常在数百MB到数GB之间。

localStorage数据丢失的常见原因:

  • 手动清除:用户或程序清除了浏览器数据。
  • 隐私模式:Safari隐私模式下localStorage可能不可靠,Chrome无痕模式下数据在窗口关闭后清除。
  • 存储配额超限:写入失败且未捕获异常,导致后续数据丢失。
  • 浏览器更新/重置:某些浏览器大版本更新可能清理存储。
  • 跨域问题:不同协议(http/https)、不同端口、不同子域名之间的localStorage是隔离的。
  • 磁盘清理工具:系统清理软件可能删除浏览器存储文件。

建议定期使用导出功能备份重要数据。

localStorage和sessionStorage都不适合存储敏感数据,因为它们以明文形式存储,容易受到XSS攻击。

更安全的选择:

  • HttpOnly Cookie:JavaScript无法读取,防止XSS窃取(适合认证令牌)。
  • Web Crypto API:在客户端加密数据后再存储到localStorage。
  • IndexedDB + 加密:结合加密库存储较大数据。
  • 服务端Session:敏感数据仅存服务端,客户端只保留Session ID。

安全建议:永远不要在localStorage中存储密码、信用卡号等敏感信息。