IndexedDB keyPath中特殊字符的处理策略与最佳实践

const db = await openIndexedDB(); // 假设 db 已经成功打开
const transaction = db.transaction("myStore", "readwrite");
const objectStore = transaction.objectStore("myStore");

try {
    // 尝试使用包含特殊字符的 keyPath 创建对象存储或索引
    // 这将导致错误，因为 "title@" 和 "text@" 不是合法的JS标识符
    const objectStoreWithSpecialKey = db.createObjectStore("myStore", { keyPath: "title@" });
    const indexWithSpecialKey = objectStoreWithSpecialKey.createIndex("myIndex", "text@");

    console.log("此代码通常会失败，因为keyPath不符合规范。");
} catch (error) {
    console.error("创建索引失败:", error.message);
    // 错误信息通常会指出keyPath不合法
}

/**
 * 将数据对象中包含特殊字符的键名转换为合法JS标识符。
 * @param {Object} originalData 原始数据对象
 * @returns {Object} 转换后的数据对象
 */
function preprocessDataForIndexedDB(originalData) {
    const processedData = { ...originalData }; // 创建一个副本，避免修改原始对象

    // 示例：将 "text@" 转换为 "text"
    if (processedData["text@"] !== undefined) {
        processedData.text = processedData["text@"];
        delete processedData["text@"]; // 可选：删除原始键，避免数据冗余
    }

    // 示例：将 "user@id" 转换为 "userId"
    if (processedData["user@id"] !== undefined) {
        processedData.userId = processedData["user@id"];
        delete processedData["user@id"]; // 可选
    }

    // 可以根据需要添加更多转换规则
    // 例如，一个更通用的方法可能是遍历所有键，并应用一个转换函数
    // for (const key in processedData) {
    //     if (key.includes('@')) { // 简单的检测逻辑
    //         const newKey = key.replace('@', '_'); // 替换为合法字符
    //         processedData[newKey] = processedData[key];
    //         delete processedData[key];
    //     }
    // }

    return processedData;
}

// 假设这是要存储的原始数据
const dataToStore = {
    id: 1,
    "title@": "My Awesome Post",
    "text@": "This is the content with special characters.",
    "category-id": "web-dev" // 假设也有横线
};

// 预处理数据
const processedData = preprocessDataForIndexedDB(dataToStore);
console.log("预处理后的数据:", processedData);
/*
输出示例:
{
  id: 1,
  title: "My Awesome Post",
  text: "This is the content with special characters.",
  "category-id": "web-dev" // 注意：这里我们只处理了 '@'，'category-id' 仍是原样，需要根据需求增加转换规则
}
*/

// 将 processedData 存入 IndexedDB
// const request = objectStore.add(processedData);
// request.onsuccess = () => console.log("数据已成功存储。");
// request.onerror = (event) => console.error("数据存储失败:", event.target.error);

// 在数据库版本升级事件（onupgradeneeded）中创建对象存储和索引
const request = indexedDB.open("myDatabase", 2); // 假设版本为2

request.onupgradeneeded = (event) => {
    const db = event.target.result;
    let objectStore;

    if (!db.objectStoreNames.contains("myStore")) {
        // 使用合法的 keyPath 创建对象存储，例如 "id"
        objectStore = db.createObjectStore("myStore", { keyPath: "id", autoIncrement: true });
    } else {
        objectStore = event.target.transaction.objectStore("myStore");
    }

    // 使用预处理后的合法键名创建索引
    if (!objectStore.indexNames.contains("titleIndex")) {
        objectStore.createIndex("titleIndex", "title", { unique: false });
    }
    if (!objectStore.indexNames.contains("textIndex")) {
        objectStore.createIndex("textIndex", "text", { unique: false });
    }
    // 如果 "category-id" 也需要索引，且其本身是合法的keyPath（如在JS中可以通过 o["category-id"] 访问），
    // 则可以直接使用，但如果希望通过 o.categoryId 访问，也需要预处理
    // if (!objectStore.indexNames.contains("categoryIdIndex")) {
    //     objectStore.createIndex("categoryIdIndex", "categoryId", { unique: false });
    // }

    console.log("对象存储和索引已创建或更新。");
};

request.onsuccess = (event) => {
    console.log("IndexedDB 数据库打开成功。");
    // 在这里可以执行数据存储操作
    // const db = event.target.result;
    // const transaction = db.transaction("myStore", "readwrite");
    // const objectStore = transaction.objectStore("myStore");
    // const processedData = preprocessDataForIndexedDB(dataToStore);
    // objectStore.add(processedData);
};

request.onerror = (event) => {
    console.error("IndexedDB 数据库打开失败:", event.target.error);
};

/**
 * 将从IndexedDB检索到的数据恢复到原始的键名结构。
 * @param {Object} retrievedData 从IndexedDB检索到的数据对象
 * @returns {Object} 恢复后的数据对象
 */
function restoreDataFromIndexedDB(retrievedData) {
    const restoredData = { ...retrievedData };

    // 示例：将 "text" 恢复为 "text@"
    if (restoredData.text !== undefined) {
        restoredData["text@"] = restoredData.text;
        delete restoredData.text;
    }

    // 示例：将 "userId" 恢复为 "user@id"
    if (restoredData.userId !== undefined) {
        restoredData["user@id"] = restoredData.userId;
        delete restoredData.userId;
    }

    // 同样，可以根据需要添加更多恢复规则
    return restoredData;
}

// 假设这是从 IndexedDB 检索到的数据
const retrievedItem = {
    id: 1,
    title: "My Awesome Post",
    text: "This is the content with special characters."
};

// 恢复数据
const originalItem = restoreDataFromIndexedDB(retrievedItem);
console.log("恢复后的数据:", originalItem);
/*
输出示例:
{
  id: 1,
  "title@": "My Awesome Post",
  "text@": "This is the content with special characters."
}
*/