新手开发社交APP：如何将Firebase数据库所有用户名存入数组？

嘿，别担心！熬夜卡bug真的太难受了，作为编程新手能完成设计已经超棒了😉 我来帮你把Firebase里的所有用户名存入数组，分两种常见的Firebase数据库类型给你详细说明：

如果你用的是Firebase Realtime Database #

首先确保你已经正确初始化了Firebase项目并引入了对应SDK，然后可以用下面的代码实现：

实时监听数据（数据更新时自动同步数组） #

// 初始化Firebase（如果还没配置的话）
import { initializeApp } from "firebase/app";
import { getDatabase, ref, onValue } from "firebase/database";

const firebaseConfig = {
  // 替换成你的Firebase项目配置
};

const app = initializeApp(firebaseConfig);
const db = getDatabase(app);

// 创建空数组存储用户名
const usernames = [];

// 指向存储用户数据的节点（假设你的用户数据存在"users"节点下）
const usersRef = ref(db, 'users');

// 监听节点数据变化
onValue(usersRef, (snapshot) => {
  const userData = snapshot.val();
  // 清空数组避免重复添加
  usernames.length = 0;
  
  // 遍历所有用户，提取用户名
  for (const userId in userData) {
    if (userData.hasOwnProperty(userId)) {
      // 假设每个用户对象里有"username"字段，根据你的数据结构调整
      usernames.push(userData[userId].username);
    }
  }
  
  // 这里就可以使用usernames数组了
  console.log("所有用户名：", usernames);
}, (error) => {
  console.error("读取数据出错：", error);
});

一次性获取数据（不需要实时同步） #

如果只需要获取一次数据，不用监听变化，可以用get()方法替代onValue()：

import { get } from "firebase/database";

// 一次性获取用户数据
get(usersRef).then((snapshot) => {
  if (snapshot.exists()) {
    const userData = snapshot.val();
    usernames.length = 0;
    
    for (const userId in userData) {
      usernames.push(userData[userId].username);
    }
    
    console.log("所有用户名：", usernames);
  } else {
    console.log("未找到用户数据");
  }
}).catch((error) => {
  console.error("读取数据出错：", error);
});

如果你用的是Firebase Firestore #

Firestore是文档型数据库，实现方式略有不同，代码示例如下：

一次性获取所有用户名 #

import { initializeApp } from "firebase/app";
import { getFirestore, collection, getDocs } from "firebase/firestore";

const firebaseConfig = {
  // 替换成你的Firebase项目配置
};

const app = initializeApp(firebaseConfig);
const db = getFirestore(app);

const usernames = [];

// 异步函数获取用户名
async function fetchAllUsernames() {
  try {
    // 获取"users"集合的所有文档
    const querySnapshot = await getDocs(collection(db, "users"));
    
    usernames.length = 0;
    querySnapshot.forEach((doc) => {
      // 假设每个文档包含"username"字段，根据你的数据结构调整
      const userInfo = doc.data();
      if (userInfo.username) {
        usernames.push(userInfo.username);
      }
    });
    
    console.log("所有用户名：", usernames);
  } catch (error) {
    console.error("获取用户名失败：", error);
  }
}

// 调用函数执行获取
fetchAllUsernames();

实时监听集合变化 #

如果需要实时同步数组（比如有新用户加入时自动更新），可以用onSnapshot()：

import { onSnapshot } from "firebase/firestore";

// 实时监听users集合变化
onSnapshot(collection(db, "users"), (querySnapshot) => {
  usernames.length = 0;
  
  querySnapshot.forEach((doc) => {
    const userInfo = doc.data();
    if (userInfo.username) {
      usernames.push(userInfo.username);
    }
  });
  
  console.log("更新后的用户名数组：", usernames);
}, (error) => {
  console.error("监听数据出错：", error);
});

重要注意事项 #

• 数据库权限：确保你的Firebase数据库规则允许读取数据！测试阶段可以暂时设置为开放规则，但上线前一定要修改为安全规则（比如只允许已认证用户读取）：
  • Realtime Database规则示例：

    {
      "rules": {
        ".read": "auth != null",
        ".write": "auth != null"
      }
    }
    

  • Firestore规则示例：

    rules_version = '2';
    service cloud.firestore {
      match /databases/{database}/documents {
        match /{document=**} {
          allow read, write: if request.auth != null;
        }
      }
    }
    

• 数据结构匹配：要确认你的用户数据存储路径和字段名和代码一致，比如如果你的用户存在"profiles"节点/集合下，或者字段名叫"userName"，需要对应修改代码里的引用路径和字段名。

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