查看和更改 IndexedDB 数据

查看和更改 IndexedDB 数据

IndexedDB是现代Web应用中常用的数据存储技术，特别是在需要离线存储和大量数据处理的场景中。本文将详细介绍如何使用Microsoft Edge的开发者工具查看和更改IndexedDB数据，包括查看、刷新、编辑和删除数据的具体步骤。

若要查看和更改IndexedDB数据，请使用应用程序工具。

查看 IndexedDB 数据

1. 在新窗口或选项卡中打开使用 IndexedDB 的网页。可以使用PWAmp 演示应用程序。
2. 若要打开 DevTools，请右键单击网页，然后选择“检查”。 或者，按Ctrl+Shift+I（Windows、Linux）或Command+Option+I(macOS)。 DevTools 随即打开。
3. 在 DevTools 的“活动栏”上，选择“应用程序”选项卡。如果该选项卡不可见，请单击“更多工具”按钮。
4. 默认情况下，通常会打开“清单”窗格：

5. 在边栏中的“存储”下，展开“IndexedDB”菜单，查看哪些数据库可用：

• keyval-store表示数据库。
• keyval是数据库中的对象存储区。

6. 选择数据库keyval-store，查看其源、版本号和有关数据库的其他信息：
7. keyval 单击对象存储，查看键值对：

注意：IndexedDB 数据不会实时更新。 如果对象存储中显示过时的数据，请刷新对象存储视图。 请参阅刷新 IndexedDB 数据。

8. 单击“值”列中的单元格以展开该值：

刷新 IndexedDB 数据

应用程序工具中的 IndexedDB 值不会实时更新。

• 若要刷新数据，请查看对象存储，然后单击“刷新”按钮。
• 若要刷新 IndexedDB 数据库中的所有数据，请查看数据库，然后单击“刷新数据库”。

编辑 IndexedDB 数据

无法从应用程序工具编辑 IndexedDB 键和值。 但是，由于 DevTools 有权访问页面上下文，因此可以在 DevTools 中运行 JavaScript 代码来编辑存储在 IndexedDB 数据库中的数据。

使用控制台工具编辑 IndexedDB 数据

1. 在 DevTools 的“活动栏”上，选择“控制台”选项卡。
2. 在控制台工具中，运行 JavaScript 代码以编辑 IndexedDB 数据。 例如，若要向对象存储添加新值keyval，请运行以下代码：

let connection = indexedDB.open("keyval-store", 1);
connection.onsuccess = e => {
  const database = e.target.result;
  const transaction = database.transaction("keyval", "readwrite");
  const objectStore = transaction.objectStore("keyval");
  const request = objectStore.add({foo: "bar"}, "new-key");
  request.onsuccess = e => {
    console.log(e.target.result);
  }
}

使用代码片段编辑 IndexedDB 数据

代码片段是一种在 DevTools 中重复存储和运行 JavaScript 代码的方法。 如果需要经常编辑 IndexedDB 数据，请将其存储在新代码片段中，然后运行代码片段。 若要了解详细信息，请参阅在任何网页上运行 JavaScript 的代码片段。

删除 IndexedDB 数据

可以删除以下任一项：

• IndexedDB 键值对。
• 对象存储中的所有键值对。
• IndexedDB 数据库。
• 所有 IndexedDB 存储。

下面介绍了这些选项。

删除 IndexedDB 键值对

1. 查看 IndexedDB 对象存储。
2. 单击要删除的键值对。 DevTools 突出显示键值对以指示已选中：
3. 按 Delete，或单击“删除所选”按钮：

删除对象存储中的所有键值对

1. 查看 IndexedDB 对象存储。
2. 单击“清除对象存储”按钮。

删除 IndexedDB 数据库

1. 查看要删除的 IndexedDB 数据库。
2. 单击“删除数据库”。

删除所有 IndexedDB 存储

1. 在“应用程序”工具的边栏中，单击“存储”。
2. 向下滚动到“存储”复选框，并确保选中“IndexedDB”复选框。
3. 单击“清除站点数据”按钮。

注意：

此页面的某些部分是根据Google 创建和共享的作品所做的修改，并根据Creative Commons Attribution 4.0 International License中描述的条款使用。 原始页面在此处找到，由凯斯·巴斯克创作。

本作品根据Creative Commons Attribution 4.0 International License获得许可。