IndexedDB无直接扩容接口,处理空间不足需监控预警、捕获QuotaExceededError、主动降级与引导用户清理;通过navigator.storage.estimate()预判配额压力,分片存储、体积估算、数据压缩及自动过期设计可有效规避瓶颈。

IndexedDB 本身不提供直接申请扩大配额的接口,浏览器也不会允许网页主动“扩容”。所谓“处理空间不足”,核心是监控预警、捕获错误、主动降级和引导用户干预——不是申请配额,而是适应配额限制。
捕获 QuotaExceededError 是最可靠信号
当写入失败真正发生时,浏览器会抛出 QuotaExceededError(DOMException code 22)。这是你必须响应的关键异常:
- 在
indexedDB.open()的onerror中检查:event.target.error?.name === 'QuotaExceededError' - 在事务的
onerror或写入请求(如add()、put())的onerror中同样判断该错误名 - 一旦捕获,立即暂停新数据写入,避免反复失败导致数据库状态异常
- 不要静默吞掉这个错误——它意味着当前策略已不可持续
用 navigator.storage.estimate() 做前置预判
虽然该 API 不专属于 IndexedDB,但它能反映当前 origin 下所有持久化存储(含 IndexedDB、Cache API 等)的整体压力:
- 调用
navigator.storage.estimate()获取{ usage, quota } - 当
usage / quota > 0.8(即使用率超 80%)时,视为高风险,可提前触发清理逻辑 - 注意兼容性:Safari 可能返回
quota: 0,旧版 Chrome 可能不支持,需包裹try/catch并设默认降级策略(如只依赖错误捕获) - 建议在关键操作前(如批量导入前)或每小时主动检测一次,避免高频轮询
主动控制数据规模,而非依赖配额
把“空间管理”融入设计,比事后救火更有效:
立即学习“Java免费学习笔记(深入)”;
-
分片存储:按时间(如
log_db_202407)、用途(cache_img/cache_data)拆库,旧库设为只读或归档后删除 -
写入前估算体积:对大批量数据,用
new Blob([JSON.stringify(item)]).size粗略计算总大小,超阈值(如 5MB)则截断或拒绝 -
压缩再存:对长文本、JSON 配置等字段,用
TextEncoder+pako(轻量 zlib)压缩,通常节省 60%+ 空间,读取时解压即可 -
设置自动过期:为每条记录添加
expiresAt字段,定期用游标扫描并删除过期项
温和引导用户参与清理
前端无法绕过用户授权扩大配额,但可以协助释放空间:
- 显示非侵入提示:“本地缓存接近上限,已自动清理 7 天前日志”
- 提供“清空离线数据”按钮,调用
indexedDB.deleteDatabase('your_db_name')后重建最小结构 - 对非核心数据(如预加载图片、文章正文),降级到
sessionStorage或内存Map,仅在 IndexedDB 中保留索引和元信息 - 避免调用
navigator.storage.persist():现代浏览器普遍限制其效果,且需用户交互才可能生效,实际收益低


















