跳转到主内容
新派编程网 - 新潮编程理念,全新技术课堂!

如何利用 navigator.storage.estimate 异步计算剩余磁盘空间并触发自动清理预案

navigator.storage.estimate() 返回 usage 和 quota 估算值,用于计算存储压力比值并触发分级清理:high(>80%)清缓存和非核心IDB,medium(60%-80%)清旧离线资源,low(<60%)仅删标记可丢弃数据。 可以使用
navigator.storage.estimate()
获取当前源(origin)的存储使用量和配额,但它 不直接返回剩余磁盘空间 ,而是返回该 origin 在浏览器分配的存储配额范围内的已用/可用估算值。真正的系统级磁盘剩余空间浏览器出于安全与隐私限制 不可访问 。不过,我们可以基于 estimate 结果判断存储压力,并触发前端自动清理逻辑。 理解 estimate() 返回值的含义
navigator.storage.estimate()
返回一个 Promise,resolve 一个包含两个关键字段的对象: usage :当前 origin 已使用的存储字节数(含 Cache API、IndexedDB、localStorage 等) quota :浏览器为该 origin 分配的**估算配额上限**(字节),不是设备总磁盘容量 注意:quota 是动态估算值,受设备空闲空间、用户活动、浏览器策略影响,可能远小于物理磁盘剩余空间;某些浏览器(如 Safari)可能始终返回
0
或不支持该 API。 安全地调用 estimate 并计算“相对可用率” 不要假设 quota 绝对准确,应以 usage / quota 的比值作为压力指标:
async function checkStoragePressure() { try { const { usage, quota } = await navigator.storage.estimate(); // 避免除零或 NaN if (quota === 0 || !Number.isFinite(usage) || !Number.isFinite(quota)) { return { pressure: 'unknown', usage, quota }; } const ratio = usage / quota; let level = 'low'; if (ratio > 0.8) level = 'high'; else if (ratio > 0.6) level = 'medium'; return { pressure: level, usage, quota, ratio }; } catch (err) { console.warn('storage.estimate failed:', err); return { pressure: 'unknown', usage: 0, quota: 0 }; } }
定义分级清理预案并自动触发 根据 pressure 等级执行不同强度的清理策略(需提前设计好可清理的数据类型): high 压力(>80%) :清空过期缓存、删除非核心 IndexedDB 对象仓、释放大体积临时 blob URL medium 压力(60–80%) :清理 7 天前的离线资源缓存、压缩待同步队列中的冗余记录 low 压力(<60%) :仅检查并移除明确标记为“可丢弃”的临时数据 示例触发逻辑:
async function triggerCleanup(pressure) { switch (pressure) { case 'high': await cleanupCaches(); // 清 Cache API 中过期响应 await pruneIDB('logs'); // 清 IndexedDB 中日志库旧数据 break; case 'medium': await cleanupCaches({ maxAge: 7 * 24 * 60 * 60 * 1000 }); break; } }

// 调用示例 checkStoragePressure().then(({ pressure }) => { if (['high', 'medium'].includes(pressure)) { triggerCleanup(pressure); } });

补充健壮性措施 因 estimate 不稳定,建议组合其他信号提升可靠性: 监听
storage
事件,当其他同源 tab 修改 localStorage 时重新评估 在关键写入操作前(如保存大文件)主动调用 estimate,失败则降级为保守清理 对 IndexedDB 操作加 try/catch,捕获
QuotaExceededError
并立即触发 high 级清理 在 DevTools 控制台提示用户手动清理(仅开发环境):
console.info('Storage under pressure — consider clearing site data')
浏览器不会暴露真实磁盘剩余,但通过 estimate + 主动管理,可显著降低“存储满导致功能异常”的风险。

相关文章