Firebase时间戳与TypeScript适配：类型声明及前后端实现问题

一、通用类型声明（前后端共用） #

定义兼容Firebase Timestamp实例和序列化后时间戳对象的联合类型，确保前后端类型匹配：

// 兼容实例与序列化结构的通用时间戳类型
type FirebaseTimestamp = 
  | { _seconds: number; _nanoseconds: number }
  | import("firebase/firestore").Timestamp
  | import("firebase-admin").firestore.Timestamp;

// 业务对象类型
type MyObject = {
  id?: string;
  createdAt: FirebaseTimestamp;
};

嫌导入路径繁琐的话，也可以拆分后合并：

// 前端类型文件（如types/firebase.ts）
import { Timestamp } from "firebase/firestore";
export type FrontendTimestamp = Timestamp;

// 后端云函数类型文件
import { Timestamp } from "firebase-admin/firestore";
export type BackendTimestamp = Timestamp;

// 合并为通用类型
export type FirebaseTimestamp = FrontendTimestamp | BackendTimestamp | { _seconds: number; _nanoseconds: number };

type MyObject = {
  id?: string;
  createdAt: FirebaseTimestamp;
};

二、前端（Next.js）生成与转换时间戳 #

生成时间戳 #

用Firebase Web SDK直接生成Timestamp实例存入Firestore：

import { Timestamp } from "firebase/firestore";

// 生成当前时间戳
const createdAt = Timestamp.now();

// 写入Firestore
await firestore.collection("your-collection").add({ createdAt });

转换为JS Date显示 #

从Firestore获取数据后，统一转换为Date类型：

// 获取文档
const doc = await firestore.collection("your-collection").doc("doc-id").get();
const myObject: MyObject = {
  id: doc.id,
  ...doc.data(),
};

// 转换为Date
let displayDate: Date;
if ("toDate" in myObject.createdAt) {
  // 若是Timestamp实例，直接调用toDate()
  displayDate = myObject.createdAt.toDate();
} else {
  // 若是序列化对象，用秒数+纳秒数计算
  displayDate = new Date(
    myObject.createdAt._seconds * 1000 + 
    Math.floor(myObject.createdAt._nanoseconds / 1000000)
  );
}

console.log(displayDate.toString());

三、后端云函数生成与转换时间戳 #

生成时间戳 #

用Firebase Admin SDK生成Timestamp实例：

import * as admin from "firebase-admin";

// 生成当前时间戳
const createdAt = admin.firestore.Timestamp.now();

// 写入Firestore
await admin.firestore().collection("your-collection").add({ createdAt });

转换为JS Date #

逻辑和前端一致，通过判断方法存在性处理：

const doc = await admin.firestore().collection("your-collection").doc("doc-id").get();
const myObject: MyObject = {
  id: doc.id,
  ...doc.data(),
};

let displayDate: Date;
if ("toDate" in myObject.createdAt) {
  displayDate = myObject.createdAt.toDate();
} else {
  displayDate = new Date(
    myObject.createdAt._seconds * 1000 + 
    Math.floor(myObject.createdAt._nanoseconds / 1000000)
  );
}

四、简化方案：直接使用JS Date（可选） #

如果不需要纳秒级精度，可以直接用JS Date存储和读取，类型更简洁：

存入时 #

// 前端
const createdAt = new Date();
await firestore.collection("your-collection").add({ createdAt });

// 后端
const createdAt = new Date();
await admin.firestore().collection("your-collection").add({ createdAt });

读取时 #

const doc = await firestore.collection("your-collection").doc("doc-id").get();
const myObject = doc.data() as { createdAt: Date };
console.log(myObject.createdAt.toString());

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