遇到 localstorage 空间不足时，浏览器会在 setitem() 时抛出 quotaexceedederror，需通过 try-catch 捕获并用封装函数识别该错误，再按数据重要性分级降级或清理，同时从源头控制写入体积与类型。
遇到 Web Storage（主要是 localStorage）空间不足时，浏览器不会提前预警，也不会静默丢弃数据——它会在 setItem() 执行瞬间抛出 QuotaExceededError，这是唯一明确的信号。处理的关键不是预测容量，而是让每次写入都具备容错、识别、降级和清理能力。
每次写入必须 try-catch，不能只检查一次
浏览器不提供 remainingSpace 或类似 API，也无法跨浏览器统一预估配额（iOS Safari 可能低至 1 MB，Chrome 桌面可达 10 MB）。因此：
- 所有
localStorage.setItem()调用都必须包裹try...catch - 避免在初始化时“检查一次就放心”，用户后续操作仍可能触发溢出
- 用极小试探值（如
localStorage.setItem('probe', 'x')）验证写入能力，成功后立即removeItem，不干扰业务数据
准确识别 QuotaExceededError，兼容各浏览器
错误类型不是标准构造函数 StorageQuotaExceededError（该类型不存在），而是 DOMException 实例，需按属性判断：
-
err.name === 'QuotaExceededError'（Chrome/Firefox 主流写法） -
err.name === 'NS_ERROR_DOM_QUOTA_REACHED'（旧版 Safari） -
err.code === 22（DOMException.QUOTA_EXCEEDED_ERR） -
err.code === 1014（部分 Android WebView）
建议封装判定函数，避免散落多处逻辑：
function isQuotaExceededError(err) {return err instanceof DOMException && (
err.name === 'QuotaExceededError' ||
err.name === 'NS_ERROR_DOM_QUOTA_REACHED' ||
err.code === 22 ||
err.code === 1014
);
}
熔断后分场景响应，禁止 clear()
捕获到错误只是起点，后续动作决定体验是否断裂：
- 非关键数据（如页面滚动位置、表单草稿）：可静默丢弃，并提示“本地缓存已满，当前未保存”
- 核心数据（如登录 token、主题偏好）：优先降级到
sessionStorage（同源同窗口独立配额），再 fallback 到内存缓存 + 下次启动重拉 - 严禁调用
localStorage.clear()——它会无差别删除所有键，极易误删关键字段 - 安全清理应按前缀（
draft_、cache_）、时间戳（如 7 天前）、或解析失败的脏数据筛选剔除
源头减负 + 技术升级才是长期解法
反复清理是补救，不是根治。真正降低爆满概率，要从写入源头控制：
- 只存必要字段：用户信息留
id、name、expiresAt即可，别存完整接口响应 - 禁存 base64 图片、HTML 片段等大体积内容，改用 URL 引用
- 长文本类数据（日志、草稿）可用
lz-string压缩，纯文本压缩率常达 60%+ - 真实字节数 ≠ 字符串长度：用
new TextEncoder().encode(str).length计算 UTF-8 字节长度，预留 10% 余量 - 当单条数据超 100 KB 或总量逼近 5 MB，应主动降级到 IndexedDB（支持
navigator.storage.estimate()查询配额）
