最新版AngularFire如何获取用户UID及当前登录用户对应数据

你原有代码运行失败的核心问题是 auth.currentUser 返回的是Promise实例，不能直接作为文档ID参数传给doc()方法。新版本AngularFire推荐通过AngularFireAuth.user这个Observable流来处理用户状态，适配响应式编程逻辑。

提示：你原有构造函数中定义的users是全量用户查询结果，如果你不需要获取所有用户的场景，可以直接删除相关代码，减少不必要的数据库带宽消耗。

修正方案 #

步骤1：修改FirebaseService，新增当前用户查询方法 #

首先导入需要的RxJS依赖：

import { of, Observable } from 'rxjs';
import { switchMap, map } from 'rxjs/operators';

然后在FirebaseService类中新增两个方法，分别用来获取当前用户完整数据、单独获取用户ID：

// 获取当前登录用户的完整文档数据
getCurrentUser(): Observable<User | null> {
  return this.auth.user.pipe(
    switchMap(user => {
      // 未登录状态直接返回null
      if (!user) return of(null);
      // 按用户uid查询对应单条用户数据
      return this.db.collection<User>('users').doc(user.uid).valueChanges();
    })
  );
}

// 单独获取当前登录用户的ID
getCurrentUserId(): Observable<string | null> {
  return this.auth.user.pipe(
    map(user => user ? user.uid : null)
  );
}

步骤2：组件中调用使用 #

方式1：手动订阅获取数据

// 组件中调用示例
constructor(private firebaseService: FirebaseService) {}

ngOnInit() {
  // 获取当前用户完整数据
  this.firebaseService.getCurrentUser().subscribe(user => {
    if (user) {
      console.log('用户ID：', user.uid);
      console.log('用户邮箱：', user.email);
    } else {
      // 跳转登录页等未登录逻辑
    }
  });

  // 仅获取用户ID
  this.firebaseService.getCurrentUserId().subscribe(uid => {
    if (uid) console.log('当前用户ID：', uid);
  });
}

方式2：结合async管道在模板使用（推荐，无需手动取消订阅）

组件代码：

currentUser$ = this.firebaseService.getCurrentUser();

模板代码：

<div *ngIf="currentUser$ | async as user">
  <p>当前登录用户ID：{{ user.uid }}</p>
  <p>用户邮箱：{{ user.email }}</p>
</div>

内容的提问来源于stack exchange，提问作者Alper Efe Sahin