时间戳

首页 > 解决方案 > 如何在 chrome 扩展中使用 IndexedDB？

typescript - 如何在 chrome 扩展中使用 IndexedDB？

问题描述

我正在尝试构建一个使用 IndexedDB 的 chrome 扩展。我使用idb作为包装器，但在为数据库创建初始对象存储时出现错误。我的代码如下：

const DATABASE_NAME = 'PROCRASTINATE_BLOCKER_DATABASE';
const DATABASE_VERSION = 1;
const LINK_OBJECT_STORE = 'link';

setupData(): Promise<void> {
  return openDB(DATABASE_NAME, DATABASE_VERSION).then(db => {
    if (!db.objectStoreNames.contains(LINK_OBJECT_STORE)) {
      db.createObjectStore(LINK_OBJECT_STORE,  { keyPath: 'id', autoIncrement: true });
    }
  });
}

然后在安装扩展程序时调用setupData()background.js 中的方法：

chrome.runtime.onInstalled.addListener(details => {
  if(details.reason == 'install' || details.reason == 'update'){
    repositoryOperations.setupData().then(() => alert('stuff'));
  }
});

我的 manifest.json 文件中也有“存储”和“无限存储”，但老实说，我不知道我是否需要它。

当我在浏览器中运行扩展程序时，出现以下错误：未捕获（承诺）InvalidStateError：无法在“IDBDatabase”上执行“createObjectStore”：数据库未运行版本更改事务。

我不明白自己做错了什么，我正在按照本教程进行操作，但不知道出了什么问题。如果有人可以帮助我，那就太棒了，在此先感谢。

标签： typescriptgoogle-chrome-extensionindexeddb

解决方案

我只需要将代码更改为 openDB 方法的第三个参数，正如 wOxxOm 在评论中所建议的那样。最后它看起来像这样：

setupData(): void {
  openDB(DATABASE_NAME, DATABASE_VERSION, {
    upgrade(db) {
      if (!db.objectStoreNames.contains(LINK_OBJECT_STORE)) {
        db.createObjectStore(LINK_OBJECT_STORE,  { keyPath: 'id', autoIncrement: true });
      }
    }
  })
}

推荐阅读