Firebase+React项目新用户注册时自动创建Firestore文档的实现问题

安全阿岳

2026-9-30

Firebase + React 注册自动生成Firestore用户文档解决方案

问题根因

未获取createUserWithEmailAndPassword执行成功后返回的用户凭据对象，调用创建文档函数时入参为空触发报错
setDoc是异步方法，未添加await处理异步逻辑会出现执行时序异常
函数名存在拼写错误：creatProfileDocument少了字母e，调用时拼写不一致也会触发报错

修正后代码

// 修正后的SignUp函数
async function signUp(email, password) {
  // 接收注册成功返回的用户凭据
  const userCredential = await createUserWithEmailAndPassword(auth, email, password);
  const currentUser = userCredential.user;
  // 调用创建文档方法，异步逻辑加await处理
  await createProfileDocument(currentUser);
}

// 修正后的创建用户文档函数，改为异步方法并添加空值校验
const createProfileDocument = async (currentuser) => {
  // 空值拦截，避免非预期报错
  if (!currentuser) return;
  await setDoc(doc(db, "users", currentuser.uid), {
    email: currentuser.email,
    age: false,
    name: "",
  })
};

额外注意事项

请确保你已经正确配置Firestore权限规则，测试阶段可以临时使用以下规则验证功能：

rules_version = '2';
service cloud.firestore {
  match /databases/{database}/documents {
    match /users/{userId} {
      allow create: if request.auth != null && request.auth.uid == userId;
    }
  }
}

上线前请根据实际业务需求调整权限规则，避免数据安全风险。