|
@@ -1,41 +1,19 @@
|
|
// 初始化数据库函数
|
|
// 初始化数据库函数
|
|
export async function initDatabase() {
|
|
export async function initDatabase() {
|
|
- return new Promise((resolve, reject) => {
|
|
|
|
- // 不指定版本号以使用现有的最新版本
|
|
|
|
- const request = indexedDB.open("FileDataDB");
|
|
|
|
- request.onsuccess = (event) => {
|
|
|
|
- const db = event.target.result;
|
|
|
|
- resolve(db);
|
|
|
|
- };
|
|
|
|
- request.onerror = (event) => {
|
|
|
|
- console.error("Failed to open IndexedDB:", event.target.error);
|
|
|
|
- reject(event.target.error);
|
|
|
|
- };
|
|
|
|
- });
|
|
|
|
- // return new Promise((resolve, reject) => {
|
|
|
|
- // const request = indexedDB.open("FileDataDB");
|
|
|
|
- // // 处理数据库的升级逻辑,仅在数据库版本更新时调用
|
|
|
|
- // request.onupgradeneeded = (event) => {
|
|
|
|
- // const db = event.target.result;
|
|
|
|
- // // 如果不存在 "files" 对象存储,则创建
|
|
|
|
- // if (!db.objectStoreNames.contains("files")) {
|
|
|
|
- // db.createObjectStore("files", { keyPath: "id" });
|
|
|
|
- // }
|
|
|
|
- // };
|
|
|
|
- // // 数据库打开成功
|
|
|
|
- // request.onsuccess = (event) => {
|
|
|
|
- // const db = event.target.result;
|
|
|
|
- // resolve(db);
|
|
|
|
- // };
|
|
|
|
- // // 数据库打开失败
|
|
|
|
- // request.onerror = (event) => {
|
|
|
|
- // console.error("无法连接到数据库:", event.target.error);
|
|
|
|
- // reject(event.target.error);
|
|
|
|
- // };
|
|
|
|
- // });
|
|
|
|
|
|
+ try {
|
|
|
|
+ const db = await new Promise((resolve, reject) => {
|
|
|
|
+ const request = indexedDB.open("FileDataDB");
|
|
|
|
+ request.onsuccess = (event) => resolve(event.target.result);
|
|
|
|
+ request.onerror = (event) => reject(event.target.error);
|
|
|
|
+ });
|
|
|
|
+ return db;
|
|
|
|
+ } catch (error) {
|
|
|
|
+ console.error("Failed to open IndexedDB:", error);
|
|
|
|
+ return null; // 可以返回默认值,如 null,避免影响页面
|
|
|
|
+ }
|
|
}
|
|
}
|
|
|
|
|
|
-//判断是否存在这个数据库及表
|
|
|
|
|
|
+// 判断是否存在这个数据库及表
|
|
export function checkObjectStoreExists(dbName, storeName) {
|
|
export function checkObjectStoreExists(dbName, storeName) {
|
|
return new Promise((resolve, reject) => {
|
|
return new Promise((resolve, reject) => {
|
|
const request = indexedDB.open(dbName);
|
|
const request = indexedDB.open(dbName);
|
|
@@ -48,12 +26,13 @@ export function checkObjectStoreExists(dbName, storeName) {
|
|
};
|
|
};
|
|
|
|
|
|
request.onerror = (event) => {
|
|
request.onerror = (event) => {
|
|
- console.error("数据库打开失败:", event.target.error);
|
|
|
|
- reject(event.target.error);
|
|
|
|
|
|
+ console.error("Database open failed:", event.target.error);
|
|
|
|
+ resolve(false); // 错误发生时返回 false,避免影响页面
|
|
};
|
|
};
|
|
});
|
|
});
|
|
}
|
|
}
|
|
-// 获取indexedDB所有数据
|
|
|
|
|
|
+
|
|
|
|
+// 获取 IndexedDB 所有数据
|
|
export async function getDataFromIndexedDB() {
|
|
export async function getDataFromIndexedDB() {
|
|
return new Promise((resolve, reject) => {
|
|
return new Promise((resolve, reject) => {
|
|
const request = indexedDB.open("FileDataDB");
|
|
const request = indexedDB.open("FileDataDB");
|
|
@@ -63,11 +42,9 @@ export async function getDataFromIndexedDB() {
|
|
const transaction = db.transaction(["files"], "readonly");
|
|
const transaction = db.transaction(["files"], "readonly");
|
|
const store = transaction.objectStore("files");
|
|
const store = transaction.objectStore("files");
|
|
|
|
|
|
- // 使用 getAll() 方法获取全部数据
|
|
|
|
const getRequest = store.getAll();
|
|
const getRequest = store.getAll();
|
|
getRequest.onsuccess = () => {
|
|
getRequest.onsuccess = () => {
|
|
if (getRequest.result && getRequest.result.length > 0) {
|
|
if (getRequest.result && getRequest.result.length > 0) {
|
|
- // 假设获取的数据中包含 fileDataArray 数据
|
|
|
|
const fileData = getRequest.result.find(
|
|
const fileData = getRequest.result.find(
|
|
(item) => item.id === "fileDataArray"
|
|
(item) => item.id === "fileDataArray"
|
|
);
|
|
);
|
|
@@ -82,24 +59,23 @@ export async function getDataFromIndexedDB() {
|
|
"Failed to retrieve data from IndexedDB:",
|
|
"Failed to retrieve data from IndexedDB:",
|
|
event.target.error
|
|
event.target.error
|
|
);
|
|
);
|
|
- reject(event.target.error);
|
|
|
|
|
|
+ resolve([]); // 错误发生时返回空数组,避免影响页面展示
|
|
};
|
|
};
|
|
};
|
|
};
|
|
|
|
|
|
request.onerror = (event) => {
|
|
request.onerror = (event) => {
|
|
console.error("Failed to open IndexedDB:", event.target.error);
|
|
console.error("Failed to open IndexedDB:", event.target.error);
|
|
- reject(event.target.error);
|
|
|
|
|
|
+ resolve([]); // 错误发生时返回空数组
|
|
};
|
|
};
|
|
});
|
|
});
|
|
}
|
|
}
|
|
|
|
|
|
-// 清除 FileDataDB整个对象存储
|
|
|
|
|
|
+// 清除 FileDataDB 整个对象存储
|
|
export async function clearAllDataFromIndexedDB() {
|
|
export async function clearAllDataFromIndexedDB() {
|
|
return new Promise((resolve, reject) => {
|
|
return new Promise((resolve, reject) => {
|
|
const versionRequest = indexedDB.open("FileDataDB");
|
|
const versionRequest = indexedDB.open("FileDataDB");
|
|
versionRequest.onsuccess = (event) => {
|
|
versionRequest.onsuccess = (event) => {
|
|
const db = event.target.result;
|
|
const db = event.target.result;
|
|
- // 检查对象存储是否存在
|
|
|
|
if (!db.objectStoreNames.contains("files")) {
|
|
if (!db.objectStoreNames.contains("files")) {
|
|
console.log("Object store 'files' does not exist. No action needed.");
|
|
console.log("Object store 'files' does not exist. No action needed.");
|
|
db.close();
|
|
db.close();
|
|
@@ -107,7 +83,7 @@ export async function clearAllDataFromIndexedDB() {
|
|
}
|
|
}
|
|
const currentVersion = db.version;
|
|
const currentVersion = db.version;
|
|
db.close();
|
|
db.close();
|
|
- // 使用当前版本或更高版本打开数据库
|
|
|
|
|
|
+
|
|
const request = indexedDB.open("FileDataDB", currentVersion);
|
|
const request = indexedDB.open("FileDataDB", currentVersion);
|
|
request.onsuccess = (event) => {
|
|
request.onsuccess = (event) => {
|
|
const db = event.target.result;
|
|
const db = event.target.result;
|
|
@@ -120,19 +96,22 @@ export async function clearAllDataFromIndexedDB() {
|
|
console.log("All data cleared from IndexedDB.");
|
|
console.log("All data cleared from IndexedDB.");
|
|
resolve();
|
|
resolve();
|
|
};
|
|
};
|
|
|
|
+
|
|
clearRequest.onerror = (event) => {
|
|
clearRequest.onerror = (event) => {
|
|
console.error(
|
|
console.error(
|
|
"Failed to clear data from IndexedDB:",
|
|
"Failed to clear data from IndexedDB:",
|
|
event.target.error
|
|
event.target.error
|
|
);
|
|
);
|
|
- reject(event.target.error);
|
|
|
|
|
|
+ reject(event.target.error); // 错误发生时拒绝 Promise
|
|
};
|
|
};
|
|
};
|
|
};
|
|
|
|
+
|
|
request.onerror = (event) => {
|
|
request.onerror = (event) => {
|
|
console.error("Failed to open IndexedDB:", event.target.error);
|
|
console.error("Failed to open IndexedDB:", event.target.error);
|
|
reject(event.target.error);
|
|
reject(event.target.error);
|
|
};
|
|
};
|
|
};
|
|
};
|
|
|
|
+
|
|
versionRequest.onerror = (event) => {
|
|
versionRequest.onerror = (event) => {
|
|
console.error("Failed to retrieve database version:", event.target.error);
|
|
console.error("Failed to retrieve database version:", event.target.error);
|
|
reject(event.target.error);
|
|
reject(event.target.error);
|
|
@@ -140,8 +119,7 @@ export async function clearAllDataFromIndexedDB() {
|
|
});
|
|
});
|
|
}
|
|
}
|
|
|
|
|
|
-// 清除 myIndexedDB整个对象存储
|
|
|
|
-
|
|
|
|
|
|
+// 清除 myIndexedDB 整个对象存储
|
|
export const clearMyIndexedDBIndexedDB = () => {
|
|
export const clearMyIndexedDBIndexedDB = () => {
|
|
const dbName = "myIndexedDB";
|
|
const dbName = "myIndexedDB";
|
|
|
|
|
|
@@ -149,22 +127,23 @@ export const clearMyIndexedDBIndexedDB = () => {
|
|
|
|
|
|
request.onsuccess = (event) => {
|
|
request.onsuccess = (event) => {
|
|
const db = event.target.result;
|
|
const db = event.target.result;
|
|
-
|
|
|
|
- const transaction = db.transaction(db.objectStoreNames, "readwrite");
|
|
|
|
-
|
|
|
|
- for (const storeName of db.objectStoreNames) {
|
|
|
|
- if (storeName.startsWith("vuexData")) {
|
|
|
|
- const objectStore = transaction.objectStore(storeName);
|
|
|
|
- objectStore.clear().onsuccess = () => {
|
|
|
|
- console.log(`Cleared all data in ${storeName}`);
|
|
|
|
- };
|
|
|
|
|
|
+ try {
|
|
|
|
+ const transaction = db.transaction(db.objectStoreNames, "readwrite");
|
|
|
|
+ for (const storeName of db.objectStoreNames) {
|
|
|
|
+ if (storeName.startsWith("vuexData")) {
|
|
|
|
+ const objectStore = transaction.objectStore(storeName);
|
|
|
|
+ objectStore.clear().onsuccess = () => {
|
|
|
|
+ console.log(`Cleared all data in ${storeName}`);
|
|
|
|
+ };
|
|
|
|
+ }
|
|
}
|
|
}
|
|
|
|
+ transaction.oncomplete = () => {
|
|
|
|
+ console.log("All vuexData tables cleared.");
|
|
|
|
+ db.close();
|
|
|
|
+ };
|
|
|
|
+ } catch (e) {
|
|
|
|
+ console.log(e);
|
|
}
|
|
}
|
|
-
|
|
|
|
- transaction.oncomplete = () => {
|
|
|
|
- console.log("All vuexData tables cleared.");
|
|
|
|
- db.close();
|
|
|
|
- };
|
|
|
|
};
|
|
};
|
|
|
|
|
|
request.onerror = (event) => {
|
|
request.onerror = (event) => {
|
|
@@ -172,46 +151,55 @@ export const clearMyIndexedDBIndexedDB = () => {
|
|
};
|
|
};
|
|
};
|
|
};
|
|
|
|
|
|
-//往indexedDB 某一个表里添加一条数据
|
|
|
|
|
|
+// 往 IndexedDB 某一个表里添加一条数据
|
|
export async function storeSetData(db, storeName, key, newFileData, callback) {
|
|
export async function storeSetData(db, storeName, key, newFileData, callback) {
|
|
if (!db) {
|
|
if (!db) {
|
|
- console.error("数据库未初始化.");
|
|
|
|
|
|
+ console.error("Database is not initialized.");
|
|
return;
|
|
return;
|
|
}
|
|
}
|
|
const transaction = db.transaction([storeName], "readwrite");
|
|
const transaction = db.transaction([storeName], "readwrite");
|
|
const store = transaction.objectStore(storeName);
|
|
const store = transaction.objectStore(storeName);
|
|
- // 尝试获取已存在的 `fileDataArray`
|
|
|
|
|
|
+
|
|
const getRequest = store.get(key);
|
|
const getRequest = store.get(key);
|
|
getRequest.onsuccess = () => {
|
|
getRequest.onsuccess = () => {
|
|
const fileDataArray = getRequest.result ? getRequest.result.data : [];
|
|
const fileDataArray = getRequest.result ? getRequest.result.data : [];
|
|
- console.log("当前 fileDataArray:", fileDataArray);
|
|
|
|
|
|
+ console.log("Current fileDataArray:", fileDataArray);
|
|
|
|
|
|
- fileDataArray.push(newFileData); // 新数据添加到数组
|
|
|
|
|
|
+ fileDataArray.push(newFileData);
|
|
|
|
|
|
const putRequest = store.put({
|
|
const putRequest = store.put({
|
|
id: key,
|
|
id: key,
|
|
data: fileDataArray,
|
|
data: fileDataArray,
|
|
});
|
|
});
|
|
|
|
+
|
|
putRequest.onsuccess = () => {
|
|
putRequest.onsuccess = () => {
|
|
- console.log("数据成功保存至 IndexedDB");
|
|
|
|
|
|
+ console.log("Data successfully saved to IndexedDB");
|
|
if (callback && typeof callback === "function") {
|
|
if (callback && typeof callback === "function") {
|
|
callback();
|
|
callback();
|
|
}
|
|
}
|
|
};
|
|
};
|
|
|
|
+
|
|
putRequest.onerror = (event) => {
|
|
putRequest.onerror = (event) => {
|
|
- console.error("在 IndexedDB 中更新数据出错:", event.target.error);
|
|
|
|
|
|
+ console.error("Error updating data in IndexedDB:", event.target.error);
|
|
};
|
|
};
|
|
};
|
|
};
|
|
|
|
+
|
|
getRequest.onerror = (event) => {
|
|
getRequest.onerror = (event) => {
|
|
- console.error("从 IndexedDB 检索数据时出错:", event.target.error);
|
|
|
|
|
|
+ console.error("Error retrieving data from IndexedDB:", event.target.error);
|
|
};
|
|
};
|
|
}
|
|
}
|
|
|
|
|
|
|
|
+// 打开数据库
|
|
export async function openDB(dbName, version) {
|
|
export async function openDB(dbName, version) {
|
|
return new Promise((resolve, reject) => {
|
|
return new Promise((resolve, reject) => {
|
|
const request = indexedDB.open(dbName, version);
|
|
const request = indexedDB.open(dbName, version);
|
|
request.onsuccess = () => resolve(request.result);
|
|
request.onsuccess = () => resolve(request.result);
|
|
- request.onerror = (event) => reject(event.target.error);
|
|
|
|
|
|
+
|
|
|
|
+ request.onerror = (event) => {
|
|
|
|
+ console.error("Error opening database:", event.target.error);
|
|
|
|
+ reject(event.target.error);
|
|
|
|
+ };
|
|
|
|
+
|
|
request.onupgradeneeded = (event) => {
|
|
request.onupgradeneeded = (event) => {
|
|
const db = event.target.result;
|
|
const db = event.target.result;
|
|
if (!db.objectStoreNames.contains("vuexData")) {
|
|
if (!db.objectStoreNames.contains("vuexData")) {
|
|
@@ -221,33 +209,27 @@ export async function openDB(dbName, version) {
|
|
});
|
|
});
|
|
}
|
|
}
|
|
|
|
|
|
|
|
+// 保存数据
|
|
export async function saveData(dbName, key, value) {
|
|
export async function saveData(dbName, key, value) {
|
|
const db = await openDB(dbName, 1);
|
|
const db = await openDB(dbName, 1);
|
|
return new Promise((resolve, reject) => {
|
|
return new Promise((resolve, reject) => {
|
|
const transaction = db.transaction(["vuexData"], "readwrite");
|
|
const transaction = db.transaction(["vuexData"], "readwrite");
|
|
const store = transaction.objectStore("vuexData");
|
|
const store = transaction.objectStore("vuexData");
|
|
const request = store.put({ key, value });
|
|
const request = store.put({ key, value });
|
|
|
|
+
|
|
request.onsuccess = () => resolve(true);
|
|
request.onsuccess = () => resolve(true);
|
|
request.onerror = (event) => reject(event.target.error);
|
|
request.onerror = (event) => reject(event.target.error);
|
|
});
|
|
});
|
|
}
|
|
}
|
|
|
|
|
|
-// export async function getData(dbName, key) {
|
|
|
|
-// const db = await openDB(dbName, 1);
|
|
|
|
-// return new Promise((resolve, reject) => {
|
|
|
|
-// const transaction = db.transaction(["vuexData"], "readonly");
|
|
|
|
-// const store = transaction.objectStore("vuexData");
|
|
|
|
-// const request = store.get(key);
|
|
|
|
-// request.onsuccess = () => resolve(request.result?.value || null);
|
|
|
|
-// request.onerror = (event) => reject(event.target.error);
|
|
|
|
-// });
|
|
|
|
-// }
|
|
|
|
|
|
+// 获取数据
|
|
export async function getData(dbName, key) {
|
|
export async function getData(dbName, key) {
|
|
const db = await openDB(dbName, 1);
|
|
const db = await openDB(dbName, 1);
|
|
return new Promise((resolve, reject) => {
|
|
return new Promise((resolve, reject) => {
|
|
- const transaction = db.transaction(["vuexData"], "readonly"); // 确保使用 vuexData 作为对象存储名
|
|
|
|
|
|
+ const transaction = db.transaction(["vuexData"], "readonly");
|
|
const store = transaction.objectStore("vuexData");
|
|
const store = transaction.objectStore("vuexData");
|
|
const request = store.get(key);
|
|
const request = store.get(key);
|
|
|
|
+
|
|
request.onsuccess = () => resolve(request.result?.value || null);
|
|
request.onsuccess = () => resolve(request.result?.value || null);
|
|
request.onerror = (event) => reject(event.target.error);
|
|
request.onerror = (event) => reject(event.target.error);
|
|
});
|
|
});
|