IndexDB complete example code

Code Snippets 4 U
export const createDb = () => {
	const request = indexedDB.open(indexedDbName, 1);
	request.onerror = () => {
		console.log(dLog("Error while using indexedDb for caching"));
	};

	request.onupgradeneeded = (e: any) => {
		const db = e.target.result;
		if (!db.objectStoreNames.contains("audios")) {
			createDbNotExist(db).then(() => {
				db.close();
			});
		} else {
			db.close();
		}
	};
};

const createDbNotExist = (db: any) => {
	return new Promise(res => {
		const objectStore = db.createObjectStore("audios", { keyPath: "key" });
		objectStore.createIndex("voice", "voice", { unique: false });
		objectStore.transaction.oncomplete = () => {
			res();
		}; // on complete resolve
	});
};

export const addAudio = (audio: Blob, key: string, voice: string) => {
	return new Promise(res => {
		// add data
		const request = indexedDB.open(indexedDbName, 1);

		request.onerror = () => {
			console.log(dLog("Error while adding data to indexedDb"));
		};

		request.onsuccess = () => {
			const db = request.result;
			if (!db.objectStoreNames.contains("audios")) {
				createDbNotExist(db).then(() => {
					debugger;
					addData(db, audio, key, voice, res);
				});
			} else {
				debugger;
				addData(db, audio, key, voice, res);
			}
		};
	});
};

const addData = (db: any, audio: Blob, key: string, voice: string, res: (value?: any) => void) => {
	debugger;
	// Add Data to db
	const transaction: IDBTransaction = db.transaction(["audios"], "readwrite");
	const store = transaction.objectStore("audios");
	const request = store.add({ audio, key: btoa(key), voice });
	request.onsuccess = () => {
		db.close();
		res(true);
	};
};

export const getData = (key: string) => {
	return new Promise(res => {
		const request = indexedDB.open(indexedDbName, 1);

		request.onerror = e => {
			res(false);
			console.log(dLog(e));
		};

		request.onsuccess = e => {
			const db = request.result;
			const transaction: IDBTransaction = db.transaction(["audios"], "readwrite");
			const data = transaction.objectStore("audios").get(btoa(key));
			data.onsuccess = (e: any) => {
				db.close();
				res(data.result);
			};
			data.onerror = error => {
				db.close();
				res(false);
			};
		};
	});
};

Leave a Reply

Your email address will not be published. Required fields are marked *

seven + three =