React中使用Firebase V9为每个用户创建posts子集合并设置字段

问题背景 #

开发Instagram克隆项目时，需要为每个用户在Firebase V9中创建posts子集合，并为帖子设置imageUrl、caption、likes等字段，但当前代码无法实现需求。

现有代码 #

const uploadPostOnline = (imageUrl, caption) => {
  const userRef = doc(db, "users", "posts");
  setDoc(
    userRef,
    { imageUrl: imageUrl },
    { caption: caption },
    { likes: 0 },
    { likesByUsers: [] },
    { comments: [] },
    { createdAt: serverTimestamp() },
    {}
  );
};

相关截图 #

Firebase数据库结构 #

报错截图 #

用户ID截图 #

补充截图 #

安全规则代码 #

rules_version = '2';
service cloud.firestore {
  match /databases/{database}/documents {
     function userIsAuthenticated(){
    return request.auth != null;
  }
   match /{path=**}/posts/{postId}{
    allow read, write : if userIsAuthenticated();
         }
    match /users/{userId}{
       allow read, write : if userIsAuthenticated();
    }
 }
  }

问题分析与修正方案 #

原代码存在的问题 #

1. 文档引用错误：doc(db, "users", "posts")是将"posts"作为users集合下的文档ID，而非用户的子集合，无法定位到具体用户的posts目录。
2. setDoc参数错误：setDoc的第二个参数应为包含所有字段的单个对象，原代码传入多个独立对象会导致参数解析失败。
3. 缺少用户ID获取：未获取当前登录用户的UID，无法为特定用户创建posts子集合。

修正后的代码 #

import { doc, setDoc, serverTimestamp } from "firebase/firestore";
import { getAuth } from "firebase/auth";

const uploadPostOnline = async (imageUrl, caption) => {
  try {
    // 获取当前登录用户
    const auth = getAuth();
    const currentUser = auth.currentUser;

    if (!currentUser) {
      throw new Error("请先登录");
    }

    // 创建当前用户posts子集合下的新文档（自动生成唯一文档ID）
    const postDocRef = doc(db, "users", currentUser.uid, "posts");

    // 写入所有字段到文档
    await setDoc(postDocRef, {
      imageUrl,
      caption,
      likes: 0,
      likesByUsers: [],
      comments: [],
      createdAt: serverTimestamp()
    });

    console.log("帖子上传成功");
  } catch (error) {
    console.error("帖子上传失败：", error);
  }
};

安全规则优化（可选） #

原规则已能匹配所有posts子集合，若需更严谨的权限控制，可将通用匹配规则替换为针对用户posts的规则：

rules_version = '2';
service cloud.firestore {
  match /databases/{database}/documents {
     function userIsAuthenticated(){
      return request.auth != null;
    }

    // 仅允许认证用户访问自己的posts子集合
    match /users/{userId}/posts/{postId}{
      allow read, write : if userIsAuthenticated() && request.auth.uid == userId;
    }

    match /users/{userId}{
      allow read, write : if userIsAuthenticated();
    }
 }
}

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