navigator.storage.estimate()是前端唯一标准化API，用于估算origin总存储usage与quota，但需安全上下文，返回值为启发式估算而非精确值，须自行实现预警逻辑。
navigator.storage.estimate 是目前唯一能在前端直接读取浏览器本地存储（包括 cache、indexedDB、localStorage 等）实际占用与配额的标准化 API，但它不触发自动清理，也不提供“占用过多”的阈值定义——预警逻辑必须由你自行实现。
为什么 estimate() 返回的 quota 常为 0 或 Infinity
这是正常行为，不是 bug。Chrome/Edge 在非安全上下文（http://）、或未启用 Storage Access API 的第三方 iframe 中会限制配额暴露；Firefox 则默认返回 Infinity 表示“无硬限制”，但实际仍受磁盘空间和浏览器策略约束。
- 确保页面运行在
https://协议下（localhost也允许） - 避免在嵌入式 iframe 中调用，尤其跨源时
- 不要依赖
quota的绝对数值做判断，优先用usage / quota比值，或 fallback 到固定阈值（如 500MB）
如何写一个防抖 + 降频的实时监测函数
频繁调用 navigator.storage.estimate() 不仅开销大，还可能被浏览器节流（尤其在后台标签页）。应主动控制频率，并忽略短期毛刺。
- 用
setTimeout实现最小间隔（例如 30 秒），避免连续轮询 - 对连续两次结果做差值比较：若
usage增幅 > 20MB 且持续两轮，则视为真实增长 - 首次调用后缓存
timestamp和lastUsage，后续只比对增量而非绝对值
示例片段：
let lastCheck = 0;
let lastUsage = 0;
async function checkStorageUsage() {
if (Date.now() - lastCheck lastUsage + 20_000_000) {
if (usage > 500_000_000 || (quota > 0 && usage / quota > 0.8)) {
showStorageWarning();
}
}
lastUsage = usage;
lastCheck = Date.now();
} catch (e) {
// 忽略 DOMException: SecurityError 或 NotSupportedError
}
}
用户看到警告后，真正能清理什么
前端无法直接清空所有存储，但可引导用户执行明确、安全、有反馈的操作：
- 调用
caches.keys().then(keys => Promise.all(keys.map(k => caches.delete(k))))清理 Service Worker 缓存（需注意是否影响离线功能） - 提示用户手动进入
chrome://settings/clearBrowserData（仅 Chrome/Edge），或给出对应路径截图 - 对已知的大型
indexedDB库（如idb）提供封装好的clearDB('my-app-cache')方法，而非裸调indexedDB.deleteDatabase - 切忌自动调用
localStorage.clear()—— 它可能删掉登录态或用户偏好
真正的风险点不在「能不能读到用量」，而在于「读到之后误判」：quota 为 Infinity 时，仅靠 usage 绝对值预警容易在低端设备上过早触发；而完全依赖比值又会在 Firefox 下失效。最稳妥的方式是双轨并行——设一个保守硬阈值（如 800MB），再叠加比值判断，并始终向用户说明“这是浏览器估算，非系统级磁盘占用”。
