IndexedDB 的 versionchange 事件是触发多标签页版本升级冲突的信号源，需在 open 成功后立即监听并调用 db.close() 主动释放连接，配合 onblocked 提示用户关闭其他标签页或刷新。
IndexedDB 的 versionchange 事件本身**不用于处理多标签页版本升级冲突**，而是**触发冲突的信号源**。真正解决多标签页下版本升级失败（如 `InvalidStateError`）的关键，在于主动监听并响应这个事件——让旧标签页主动关闭或中止连接，为新版本腾出空间。
为什么多标签页会因 versionchange 冲突？
IndexedDB 规定：同一数据库在同一时刻只能有一个版本处于“活跃”状态。当一个标签页调用 indexedDB.open(dbName, newVersion) 请求升级时，如果其他标签页仍持有旧版本的 IDBDatabase 连接（未关闭），浏览器会拒绝升级，并在新连接的 onupgradeneeded 前抛出 InvalidStateError（或直接跳过升级）。此时，已打开的旧连接会收到 versionchange 事件，提示它“你快过期了，该让位了”。
正确响应 versionchange：让旧标签页自动让权
在每个打开数据库的标签页中，都应监听数据库对象的 versionchange 事件，并立即关闭当前连接：
- 监听时机：必须在
indexedDB.open()成功后、拿到IDBDatabase实例时立刻绑定 - 响应动作：调用
db.close()，断开连接，避免阻塞升级 - 可选增强：提示用户“页面已过期，请刷新”，提升体验
示例代码：
立即学习“Java免费学习笔记（深入）”；
const request = indexedDB.open('myApp', 2);
request.onupgradeneeded = event => {
const db = event.target.result;
if (event.oldVersion === 0) {
db.createObjectStore('users', { keyPath: 'id' });
}
if (event.oldVersion < 1) {
// v1 升级逻辑
}
if (event.oldVersion < 2) {
// v2 升级逻辑
}
};
request.onsuccess = event => {
const db = event.target.result;
// ✅ 关键：立即监听 versionchange
db.addEventListener('versionchange', () => {
console.warn('数据库版本即将升级，当前连接已失效');
db.close(); // 主动释放连接
// 可选：location.reload(); 或显示刷新提示
});
// 后续业务操作...
};
配合升级请求端做友好兜底
发起升级的标签页（如刚发布新版本后首次打开）也应捕获可能的失败，并引导用户刷新：
- 监听
request.onblocked：表示升级被阻塞（即有其他标签页未响应 versionchange） - 在
onblocked中提示用户关闭其他标签页或手动刷新 - 不要重试 open —— 阻塞不会自动解除，需用户干预
补充代码片段：
request.onblocked = event => {
alert('检测到新版本，但其他页面仍在使用旧数据库。\n请关闭所有同站标签页，然后刷新本页。');
// 或更友好地：显示模态框 + “刷新”按钮
};
不需要轮询或跨标签通信
无需用 localStorage + storage 事件、BroadcastChannel 或 postMessage 来协调版本。IndexedDB 原生的 versionchange 和 onblocked 已构成一套轻量、可靠、标准的多标签协同机制。只要每个标签页都正确监听并关闭自身连接，升级就能自然完成。
