vue-idle-game/src/tool/IndexedDB.ts

import { deepCopy } from './caller';

const db_name = 'transmigration_game';
export const store_name_archive = 'archive';
export const key_name_archive = 'version';

const version = 1;
let db;
/**
 * 打开数据库
 * @param {object} dbName 数据库的名字
 * @param {string} version 数据库的版本
 * @return {object} 该函数会返回一个数据库实例
 */
function openDB() {
  return new Promise((resolve, reject) => {
    //  兼容浏览器
    var indexedDB = window.indexedDB;

    // 打开数据库，若没有则会创建
    const request = indexedDB.open(db_name, version);
    // 数据库打开成功回调
    request.onsuccess = function (e) {
      db = request.result; // 数据库对象
      console.log('数据库打开成功');
      resolve(db);
    };
    // 数据库打开失败的回调
    request.onerror = function (e) {
      console.log('数据库打开报错');
    };
    // 数据库有更新时候的回调
    request.onupgradeneeded = function (e) {
      // 数据库创建或升级的时候会触发
      console.log('onupgradeneeded');
      db = request.result; // 数据库对象
      createArchiveStore();
    };
  });
}

const createArchiveStore = () => {
  if (!db.objectStoreNames.contains(store_name_archive)) {
    const objectStore = db.createObjectStore(store_name_archive, { keyPath: key_name_archive });
    // 创建索引，在后面查询数据的时候可以根据索引查
    // objectStore.createIndex(index_name_equip, index_name_equip, { unique: false });
  }
};

await openDB();

export const insertToStore = (storeName, data) => {
  data = deepCopy(data);
  return new Promise<boolean>((resolve, reject) => {
    const request = db
      .transaction([storeName], 'readwrite') // 事务对象 指定表格名称和操作模式（"只读"或"读写"）
      .objectStore(storeName) // 仓库对象
      .put(data);

    request.onsuccess = function (event) {
      resolve(true);
    };

    request.onerror = function (event) {
      resolve(false);
    };
  });
};

export const getFromStore = (storeName, id) => {
  return new Promise((resolve, reject) => {
    const store = db.transaction([storeName], 'readonly').objectStore(storeName);
    const request = store.get(id);
    request.onsuccess = (e) => {
      resolve(request.result);
    };
    request.onerror = (e) => {
      resolve([]);
    };
  });
};