IndexedDB封装

export type INDEXEDDB_PARAMS = {
	db_name: string; // 数据库名称
	store_name: string; // 仓库名
	version?: number; // 版本
	data?: any; // 存储数据
};

class IDB {
	protected db: IDBDatabase | null;

	constructor() {
		this.db = null;
		this.open = this.open.bind(this);
		this.put = this.put.bind(this);
		this.get = this.get.bind(this);
		this.getAll = this.getAll.bind(this);
		this.delete = this.delete.bind(this);
	}

	// 开
	open({ db_name, store_name, version }: INDEXEDDB_PARAMS) {
		return new Promise((resolve, reject) => {
			const indexedDB = (window.indexedDB =
				window.indexedDB ||
				window.mozIndexedDB ||
				window.webkitIndexedDB ||
				window.msIndexedDB);

			const DB = indexedDB?.open(db_name, version);

			DB.onerror = (event) => {
				const target = event?.target as IDBRequest;
				console.log(`IndexedDB ${db_name} 打开失败:${target?.error?.name}`);
				reject(target?.error);
			};

			DB.onsuccess = (event) => {
				console.log(`IndexedDB ${db_name} 打开成功`);
				const target = event?.target as IDBRequest;
				this.db = target?.result;
				resolve(this.db);
			};

			DB.onupgradeneeded = (event) => {
				console.log(`IndexedDB ${db_name} onupgradeneeded`);
				const target = event?.target as IDBRequest;
				const _db = target?.result;
				if (!_db?.objectStoreNames?.contains(store_name)) {
					_db.createObjectStore(store_name, {
						autoIncrement: true,
					});
				}
			};
		});
	}

	// 有则覆盖,无则新增
	put({ store_name, data }: INDEXEDDB_PARAMS) {
		return new Promise((resolve, reject) => {
			const transaction = this?.db?.transaction([store_name], "readwrite");
			const objectStore = transaction?.objectStore(store_name);
			const request = objectStore?.put(data);

			if (request) {
				request.onsuccess = () => {
					console.log("数据写入成功");
					resolve("数据写入成功");
				};

				request.onerror = (event) => {
					const target = event?.target as IDBRequest;
					console.log("数据写入失败:", target?.error?.name);
					reject(target?.error);
				};
			} else {
				reject("put error");
			}
		});
	}

	// 取
	get({
		store_name,
		key,
	}: INDEXEDDB_PARAMS & { key: IDBValidKey | IDBKeyRange }) {
		return new Promise((resolve, reject) => {
			const transaction = this?.db?.transaction([store_name], "readonly");
			const objectStore = transaction?.objectStore(store_name);
			const request = objectStore?.get(key);

			if (request) {
				request.onsuccess = (event) => {
					const target = event?.target as IDBRequest;
					resolve(target?.result);
				};

				request.onerror = (event) => {
					const target = event?.target as IDBRequest;
					console.log(
						`${store_name} 获取数据 ${key} 失败:`,
						target?.error?.name
					);
					reject(target?.error);
				};
			} else {
				reject("get error");
			}
		});
	}

	// 全取
	getAll({ store_name }: INDEXEDDB_PARAMS) {
		return new Promise((resolve, reject) => {
			const transaction = this?.db?.transaction([store_name], "readonly");
			const objectStore = transaction?.objectStore(store_name);
			const request = objectStore?.getAll();

			if (request) {
				request.onsuccess = (event) => {
					const target = event?.target as IDBRequest;
					resolve(target?.result);
				};

				request.onerror = (event) => {
					const target = event?.target as IDBRequest;
					console.log(`${store_name} 获取所有数据失败:`, target?.error?.name);
					reject(target?.error);
				};
			} else {
				reject("get all error");
			}
		});
	}

	// 删
	delete({
		store_name,
		key,
	}: INDEXEDDB_PARAMS & { key: IDBValidKey | IDBKeyRange }) {
		return new Promise((resolve, reject) => {
			const transaction = this?.db?.transaction([store_name], "readwrite");
			const objectStore = transaction?.objectStore(store_name);
			const request = objectStore?.delete(key);

			if (request) {
				request.onsuccess = () => {
					console.log("数据删除成功");
					resolve("数据删除成功");
				};

				request.onerror = (event) => {
					const target = event?.target as IDBRequest;
					console.log("数据删除失败:", target?.error?.name);
					reject(target?.error);
				};
			} else {
				reject("delete error");
			}
		});
	}
}

export default new IDB();

  

posted @ 2026-01-23 18:16  SKILL·NULL  阅读(0)  评论(0)    收藏  举报