localforage存html字符串不会静默失败，但因json序列化中断或quotaexceedederror被promise reject吞没，易导致无感知写入失败；须净化html、try-catch捕获错误并降级、存结构体含校验字段，恢复时需类型判断+临时dom解析+编辑器适配。
LocalForage 存 HTML 字符串会静默失败？
直接 localforage.setItem('html-draft', el.innerHTML) 很可能写入失败却不报错——因为 LocalForage 默认用 JSON.stringify() 序列化，而原始 HTML 里常含未转义双引号、<script></script> 标签、onclick="..." 等非法 JSON 字符或危险内容，导致序列化中断；更糟的是，QuotaExceededError 这类错误会被 promise reject 吞掉，用户完全无感知。
必须做三件事：
- 先用
DOMPurify.sanitize()过滤 HTML，删掉<script></script>、on*属性、data:URL 等不可信片段 - 用
try/catch包裹异步写入，并显式判断错误类型：if (e.name === 'QuotaExceededError')，降级到localStorage或提示用户清理空间 - 存结构体而非裸字符串，例如：
{ html: cleanHtml, savedAt: Date.now(), checksum: md5(cleanHtml) }，为后续校验留依据
恢复时直接 innerHTML = getItem() 是危险操作
localforage.getItem('draft-html') 返回值可能是 null、undefined、空字符串，甚至因 JSON 解析失败返回 {} —— 直接赋给 innerHTML 会清空容器，若之前没净化还可能触发 XSS。
安全恢复流程如下：
- 始终用
await localforage.getItem('draft-html')，再判断：typeof result === 'string' && result.trim().length > 0 - 创建临时 DOM 容器：
const temp = document.createElement('div'); temp.innerHTML = cleanHtml;，再取temp.firstElementChild插入目标区域，避免把文本节点、注释节点一并塞进去 - 若页面用了 Slate/ProseMirror 等富文本编辑器，别碰
innerHTML，走编辑器原生导入 API，比如editor.insertFragment(...)
LocalForage 本身不保障 HTML 结构完整性
LocalForage 只是 IndexedDB/WebSQL/LocalStorage 的统一封装层，它不理解 DOM，也不校验 HTML 是否可解析、是否包含完整标签对、是否丢失闭合标签。所谓“容灾”，是你自己要建的逻辑链：净化 → 校验 → 带元数据存储 → 类型判断 → 临时 DOM 解析 → 编辑器适配 → 引擎可用性探测（比如检查 window.DOMParser 是否存在）→ 设置降级路径（如 fallback 到 sessionStorage 或提示手动导出）。
最容易被忽略的一点是：离线状态下，你无法依赖网络加载任何外部资源（CSS、字体、图片），所以存 HTML 时就得确保所有样式内联、图片转 base64，或提前缓存好对应资源路径——LocalForage 不会帮你做这些。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
