如何在VueJS 3中获取Firebase用户创建日期

你的判断完全正确，核心问题就是你只从Firestore的profiles集合拉取了数据，但完全没从Firebase Authentication获取用户创建日期信息，所以循环里的每个user对象根本没有metadata字段，自然会触发兜底的N/A显示。

要解决这个问题，你需要把Firestore的profiles数据和Firebase Auth的用户数据关联起来（前提是profiles的id和Auth用户的uid一致），具体步骤如下：

1. 导入Firebase Auth的必要方法 #

在脚本顶部添加Auth相关的导入：

import { getAuth, listUsers } from "firebase/auth"; // 用listUsers批量获取所有用户

2. 修改数据获取逻辑，合并Auth数据 #

修改fetchData函数，先拉取profiles，再拉取Auth用户列表，然后把每个用户的创建日期合并到对应的profile中：

const fetchData = async () => {
  try {
    // 1. 拉取Firestore的profiles数据
    const profilesSnapshot = await getDocs(collection(db, "profiles"));
    const profilesList = profilesSnapshot.docs.map((doc) => ({
      id: doc.id,
      ...doc.data(),
    }));

    // 2. 拉取Firebase Auth的所有用户数据
    const auth = getAuth();
    const authUsers = await listUsers(auth, 1000); // 1000是单次拉取上限，可根据用户量调整

    // 3. 把Auth的创建日期合并到profiles中
    profiles.value = profilesList.map(profile => {
      const matchingAuthUser = authUsers.users.find(user => user.uid === profile.id);
      return {
        ...profile,
        // 将Auth的创建日期添加到profile对象中
        creationDate: matchingAuthUser?.metadata.creationTime
      };
    });
  } catch (error) {
    console.error("Error fetching data:", error);
  }
};

3. 调整日期格式化函数 #

现在user对象里直接有creationDate（ISO格式字符串），可以简化formatDate：

const formatDate = (user) => {
  if (user.creationDate) {
    const date = new Date(user.creationDate);
    return date.toLocaleDateString();
  } else {
    return 'N/A';
  }
};

4. 模板部分无需修改 #

原来的v-for循环保持不变，因为现在profiles里的每个对象已经包含了Auth的创建日期。

补充说明 #

• 如果你的profiles数量很大，listUsers的分页需要额外处理（比如循环拉取直到所有用户都获取完）
• 必须确保Firestore中profiles的id和Auth用户的uid完全一致，否则无法匹配对应数据

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