在 Angular 12 中使用 Google OAuth 和 @angular/fire@^7.0.0 firebase@^9.0.0

【问题标题】：Using Google OAuth in Angular 12 with @angular/fire@^7.0.0 firebase@^9.0.0在 Angular 12 中使用 Google OAuth 和 @angular/fire@^7.0.0 firebase@^9.0.0
【发布时间】：2025-12-07 20:15:02
【问题描述】：

在app.module.ts 中导入角度/文件模块后

import { provideFirebaseApp, getApp, initializeApp } from '@angular/fire/app';
import { getFirestore, provideFirestore } from '@angular/fire/firestore';

@NgModule({
  imports: [
    provideFirebaseApp(() => initializeApp({ ... })),
    provideFirestore(() => getFirestore()),
  ],
  ...
})
export class AppModule { }

如何在惰性功能模块上管理 Auth 服务？

【问题讨论】：

标签： angular firebase firebase-authentication angularfire2 angular12

【解决方案1】：

我认为他们还没有更新他们的文档。我不得不通过反复试验来弄清楚：

app.module.ts

provideAuth(() => getAuth()),

auth.service.ts

import {
  Auth,
  signOut,
  signInWithPopup,
  GoogleAuthProvider,
  user
} from '@angular/fire/auth';

...

export class AuthService {

  user$: Observable<any>;

  constructor(private auth: Auth) {
    this.user$ = user(this.auth);
  }

  logout(): void {
    signOut(this.auth);
  }

  login(): void {
    signInWithPopup(this.auth, new GoogleAuthProvider);
  }

  async isLoggedIn(): Promise<boolean> {

    // only use in code, use observable in template
    return !! await this.user$.pipe(take(1)).toPromise();
  }

}

【讨论】：