WebSQL 被废弃因其未进入 W3C 标准流程，仅是 SQLite 私有实现，而 IndexedDB 成为标准替代方案；二者本质不同：WebSQL 关系型、SQL 驱动，IndexedDB 对象存储、键值+索引驱动，迁移需重构数据访问逻辑。
WebSQL 被废弃不是因为做错了，而是没被标准化
WebSQL 从未进入 W3C 正式标准流程，它只是基于 SQLite 的私有实现，只有 Chrome、Safari 和旧版 Android
浏览器
支持。当 W3C 明确拒绝将其标准化（2010 年起多次讨论后终止），而 IndexedDB 进入标准轨道后，主流浏览器就逐步停止新增功能支持——
已移除 WebSQL 的非安全上下文启用能力，
在非 HTTPS 页面彻底禁用
。
IndexedDB 替代 WebSQL 的核心差异点
WebSQL 是关系型、SQL 驱动；IndexedDB 是对象存储、键值+索引驱动。迁移不是“换函数名”，而是重构
数据访问
逻辑：
→
，但需监听
手动建库建表（即 objectStore）
没有
或
，查数据靠
、
或游标
所有操作异步且基于事务：读写必须在
内进行，离开事务上下文立刻失效
不支持 SQL 字符串查询，过滤靠
前端
遍历或 index + key range（如
）
常见踩坑：从 WebSQL 迁移时最易出错的三件事
开发者常把 IndexedDB 当成“带 Promise 的 WebSQL”，结果卡在黑盒错误里：
忘记在
中创建
，导致后续
报错
在事务提交后还调用
或
，报
—— 必须把所有操作放在
之前
用
取值时没检查是否为
（比如
没匹配到），直接解构导致
现在该用什么？优先选 IndexedDB，但别硬扛
IndexedDB 原生 API 确实冗长，容易写错。生产项目几乎都封装一层：
Comet AI 浏览器
下载 Comet AI 浏览器，体验由 Perplexity AI 驱动的革命性上网方式。内置 AI 助手可实时总结网页、跨标签页对比信息、自动执行任务。告别繁琐操作，让 AI 成为你的浏览副驾，大幅提升研究与工作效率。支持 Windows、macOS、Android 和 iOS。
下载
立即学习
“
前端免费学习笔记（深入）
”；
轻量级：用
库（
），提供 Promise 化接口和自动事务管理
需要类 SQL 查询：考虑
（自动降级到 WebSQL/LocalStorage，但注意 WebSQL 已不可靠）或更现代的
（语法接近 SQL，但底层仍是 IndexedDB）
若只需简单
键值对
，
+
仍够用；若涉及大量结构化数据或离线同步，IndexedDB 是唯一合规选择
真正难的不是 API 本身，而是理解“数据库操作必须绑定生命周期”——事务、版本升级、游标释放，这些概念在 WebSQL 里被 SQL 层掩盖了，换成 IndexedDB 就全摊开在你眼前。
chrome 133Safari 17window.openDatabaseopenDatabaseindexedDB.openonupgradeneededSELECTJOINobjectStore.get()objectStore.index('xxx').get()openCursortransaction.objectStore('name')IDBKeyRange.bound('a','z')onupgradeneededobjectStoretransaction.objectStore('xxx')NotFoundError: Unknown errorget()put()TransactionInactiveErrortransaction.oncompleteevent.target.resultundefinedget()Cannot read property 'xxx' of undefinedconst request = indexedDB.open('mydb', 1);
request.onupgradeneeded = (event) => {
const db = event.target.result;
if (!db.objectStoreNames.contains('users')) {
const store = db.createObjectStore('users', { keyPath: 'id' });
store.createIndex('by_email', 'email', { unique: true });
}
};
request.onsuccess = (event) => {
const db = event.target.result;
const tx = db.transaction('users', 'readonly');
const store = tx.objectStore('users');
const emailIndex = store.index('by_email');
const req = emailIndex.get('alice@example.com');
req.onsuccess = () => {
console.log(req.result); // 注意：可能为 undefined
};
};idbnpm install idblocalForageDexie.jslocalStorageJSON.stringify