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

Web Storage 配额模拟器 - 测试存储超限行为

存储 测试 存储 异常 模拟 配额
21
0
0
0

Web Storage 配额模拟器

模拟 localStorage / sessionStorage 配额限制，测试存储超限行为

实时监控中
存储配置
持久化存储，关闭浏览器后数据保留
0.5 MB 10 MB 20 MB
开启后仅操作带前缀的测试数据，保护现有存储
存储状态： 可用
快速场景
0% 已使用
存储用量 0 KB / 5 MB
0%
条目数 0
剩余空间 5 MB
配额使用率 0%
写入数据
数据由随机字符生成，模拟真实存储内容。键名自动添加时间戳后缀。
存储内容 0 条
键名 大小 值预览
暂无测试数据
操作日志
✓ 模拟器已就绪，等待操作...
常见问题与知识点
localStorage 和 sessionStorage 有什么区别？

localStorage 数据持久化存储，关闭浏览器后仍保留；sessionStorage 仅在当前会话有效，关闭标签页后数据即被清除。两者均受同源策略限制，配额通常为 5-10MB。

浏览器默认存储配额是多少？

Chrome、Firefox、Edge 通常为每源约 10MB；Safari 约为 5MB；移动端浏览器可能更少（2-5MB）。达到配额上限时会抛出 QuotaExceededError。

如何检测存储是否已满？

使用 try-catch 包裹 setItem 操作，捕获 DOMException 异常。异常名称通常为 "QuotaExceededError"。也可在写入前估算数据大小进行预判。

如何计算 Web Storage 的使用量？

JavaScript 字符串使用 UTF-16 编码，每个字符约占 2 字节。遍历所有键值对，累加 (键长度 + 值长度) × 2 即可估算总使用量。也可使用 Blob API 精确计算。

Web Storage 适合存储什么类型的数据？

适合存储小型键值对数据，如用户偏好设置、认证 Token、UI 状态缓存、离线表单草稿等。不适合存储大量结构化数据或二进制文件，此时应使用 IndexedDB。

存储超限时应如何处理？

捕获异常后，可采取清理过期数据、压缩内容、降级到内存存储、提示用户清理缓存等策略。建议实现 LRU 淘汰机制或设置数据过期时间来主动管理存储空间。

🔧 相关工具