推荐用localStorage存Base64字符串（小图≤1MB、≤10张）或IndexedDB存Blob对象（大图、多图、长期保留）；临时预览直接用URL.createObjectURL最高效。
在HTML5中保存用户上传的历史图片，推荐用 localStorage 存 Base64 字符串（适合小图），或用 IndexedDB 存 Blob 对象（适合大图、多图、需长期保留的场景）。直接存 Blob 到 localStorage 会失败，因为 localStorage 只支持字符串。
存 Base64 到 localStorage（轻量、简单）
适用于头像、截图等尺寸较小（建议 ≤ 1MB）、数量不多（如最近 10 张）的图片。Base64 是纯字符串，可直接存取。
- 上传后读取文件为 Base64：
const reader = new FileReader(); reader.readAsDataURL(file); - 成功后提取 base64 数据（去掉前缀）：
const base64Data = result.split(',')[1]; - 存入 localStorage：
localStorage.setItem('recentImages', JSON.stringify([{id: Date.now(), data: base64Data, name: file.name}])) - 读取时解析 JSON，渲染：
存 Blob 到 IndexedDB（可靠、可扩展）
适合保存原图质量、大尺寸图片或大量历史记录。Blob 本身不可序列化，但 IndexedDB 原生支持存储 Blob 和 File 对象。
Wechat Article Html
下载
将 Markdown 文章转换为微信公众号兼容的纯 HTML 格式。当用户要求"转成微信格式"、"生成公众号文章 HTML"、"排版到微信草稿箱"、"微信粘贴格式"时触发。输出带内联样式的纯 HTML，微信编辑器可直接渲染，无需额外适配。支持标题、段落、列表、粗体、行内代码、表格、引用块、代码块、配图的完整转换。
- 打开数据库，创建 objectStore（如
images），键路径设为id或自增 - 上传后直接将
file（即 Blob）存入：store.add({id: Date.now(), blob: file, name: file.name, time: new Date()}) - 读取时用
URL.createObjectURL(blob)生成临时 URL 渲染图片（注意用完调URL.revokeObjectURL()避免内存泄漏） - 可配合图片元信息（宽高、类型、缩略图）一起存储，便于列表展示
注意事项与优化建议
避免踩坑，提升体验：
- Base64 存储会比原始二进制大 ~33%，且占用更多内存；单张超过 2MB 易触发 localStorage 限制（通常 5–10MB）
- IndexedDB 操作是异步的，需用 promise 封装或 async/await 处理；首次使用建议加错误兜底（如降级到 Base64）
- 隐私敏感场景（如医疗、证件图），不建议本地长期留存；可添加「自动清理」逻辑（如只保留最近 30 天）
- 若需跨设备同步，本地存储无法满足，应搭配后端 API 实现
补充：临时预览用 URL.createObjectURL 即可
仅需当前页面内快速显示上传图片，无需持久化？直接用 URL.createObjectURL(file) 最高效。它返回一个生命周期绑定到 document 的临时 URL，页面卸载时自动释放，不占存储空间，也不涉及编码转换。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
