浏览器存储JavaScript_IndexedDB事务处理-js教程-PHP中文网

浏览器存储JavaScript_IndexedDB事务处理

夜晨

发布： 2025-11-24 20:22:02

原创

668人浏览过

IndexedDB事务是数据操作的核心，所有读写必须在事务中进行。事务有三种模式：readonly、readwrite和versionchange，通过transaction()方法创建并绑定对象仓库。事务自动提交机制不存在，需依赖异步请求完成或主动中止。每个事务可监听complete、error和abort事件以确保流程可控。常见问题包括在事务外操作store、未处理错误导致静默失败等，最佳实践是缩小事务范围、及时监听成功与错误回调、批量操作复用同一事务以提升性能。关键点是事务生命周期由异步操作驱动，控制好流程才能保障数据一致性与可靠性。

浏览器存储javascript_indexeddb事务处理

IndexedDB 是浏览器提供的一种强大、异步的本地存储方案，适合存储大量结构化数据。在使用 IndexedDB 时，事务处理是核心机制之一，确保数据操作的完整性与一致性。理解并正确使用事务，是掌握 IndexedDB 的关键。

事务的基本概念

IndexedDB 中的所有数据操作都必须在事务中进行。事务围绕一个或多个对象仓库（Object Store）运行，具有明确的生命周期：启动、使用、完成或失败。

事务有三种模式：

readonly：只读事务，用于查询数据，性能最好。
readwrite：读写事务，用于增删改操作。
versionchange：用于数据库版本升级，如创建或删除对象仓库。

事务自动提交机制不存在——一旦你发起事务，必须通过完成所有请求让它自然结束，或者主动中止。

立即学习“Java免费学习笔记（深入）”；

创建和使用事务

通过 transaction() 方法创建事务，传入对象仓库名和模式：

const transaction = db.transaction(['users'], 'readwrite');
const store = transaction.objectStore('users');

接着可在该事务中执行增、删、改、查操作：

// 添加数据
const addRequest = store.add({ id: 1, name: 'Alice' });
addRequest.onsuccess = () => console.log('添加成功');

// 查询数据
const getRequest = store.get(1);
getRequest.onsuccess = (e) => console.log(e.target.result);

所有这些操作共享同一个事务上下文，只要有一个操作失败且未处理错误，事务就会进入错误状态。

畅图

AI可视化工具

147

查看详情

事务的生命周期与事件监听

事务是异步的，依赖事件驱动。你可以监听以下关键事件：

complete：事务成功完成时触发。
error：任何操作出错时触发。
abort：事务被中止时触发。

示例：

transaction.oncomplete = () => console.log('事务完成');
transaction.onerror = (e) => console.error('事务失败:', e.target.error);
transaction.onabort = () => console.warn('事务已中止');

注意：不能在事务外部执行对象仓库的操作。一旦事务结束，相关 store 实例失效。