IndexedDB：如何避免长整型数值被存储为字符串？

问题现象 #

存储通过new Date().valueOf()获取的毫秒级时间戳时，IndexedDB会自动将其转为字符串，导致索引排序异常。具体表现：

• 本地创建的Note对象，dateCreated和lastUpdated字段存入数据库后变为字符串类型
• 从Node服务器同步的同名字段却保持数值类型
• 手动将字段设为0这类小数值时，能正常以数值类型存储
• 存入前调试确认字段确实为数值类型

解决方案 #

1. 显式转换数值类型后存储 #

在upsert方法中手动将目标字段转为数值，强制确保存储时的类型正确：

async upsert(data: Note) {
  try {
    // 显式转换时间戳字段为数值类型
    const processedData = {
      ...data,
      dateCreated: Number(data.dateCreated),
      lastUpdated: Number(data.lastUpdated)
    };
    const db = await this.dbPromise;
    const tx = db.transaction(this.tableName, 'readwrite');
    const store = tx.objectStore(this.tableName);
    store.put(processedData);
    await tx.done;
  } catch (err) {
    return undefined;
  }
}

2. 校验Note类型定义 #

确保Note接口中dateCreated和lastUpdated的类型严格为number，避免类型断言导致的隐式转换：

interface Note {
  id: string;
  title: string;
  content: string;
  dateCreated: number; // 明确为数值类型
  lastUpdated: number;
  status: string;
  tags: string;
  userId: string;
}

3. 排查序列化环节的类型丢失 #

检查pushToSyncOutQueue等涉及数据传递的方法，确认没有将数值类型的时间戳意外序列化为字符串（比如不必要的JSON.stringify操作）。

4. 直接存储Date对象（可选） #

如果业务允许，可直接存储Date对象，IndexedDB会自动将其转为数值型时间戳存储，省去手动处理毫秒数的步骤：

// 创建对象时直接存储Date实例
const newNote = {
  id: generateUUID(),
  title: 'Untitled',
  content: '',
  dateCreated: new Date(),
  lastUpdated: new Date(),
  status: 'ACTIVE',
  tags: '',
  userId: this.auth.auth.value.id,
} as Note;

// 读取时转为毫秒数
const note = await store.get(targetId);
const timestamp = note.dateCreated.valueOf();

验证方式 #

修改后重新创建本地Note，通过浏览器DevTools的Application面板查看IndexedDB存储记录，确认dateCreated和lastUpdated显示为数值（无引号包裹）。

内容的提问来源于stack exchange，提问作者Alvin Stefanus