Question

我是angular的新手，正在尝试使用Firebase进行身份验证。我已经建立了登录/注册和注销。现在它可以正常工作，但是现在我想显示一个具有登录按钮和注销按钮的导航栏（完全独立的组件）。我需要根据用户的authState切换这些按钮。所以我在authState上使用了订阅。但是它仅在用户登录时有效。在用户注销时不会触发。当用户注销正确时，应该返回null吗？我检查了authService内的authState，在用户注销后为null。那我在做什么错了？

这是我的代码。

auth.service.ts

pass

nav.component.ts

import { Injectable } from '@angular/core';
import { AngularFirestore } from '@angular/fire/firestore';
import { AngularFireAuth } from '@angular/fire/auth';
import { Observable, of } from 'rxjs';
import * as firebase from 'firebase/app';

@Injectable({
  providedIn: 'root'
})

export class AuthService {
  authState: any;

  constructor(
    public db: AngularFirestore,
    public mAuth: AngularFireAuth
  ) {}

  getAuthState() {
    return this.mAuth.authState;
  }
  doLogout() {
    return new Promise((resolve, reject) => {
      if (firebase.auth().currentUser) {
        this.mAuth.auth.signOut();
        resolve();
      } else {
        reject();
      }
    });
  }

/* login, register, etc... */

}

Answer 1

我非常确定您的authService doLogout()返回的是Promise。

auth.signout()已返回承诺。

我认为您的doLogout()函数应为：

return this.mAuth.auth.signout()

边注：我遇到了完全相同的问题，这是因为authstate受到router.navigate的某种影响。我的错误是：

this.authstate.signout();
this.router.navigate(['/']);

但是使用上面的代码，authstate永远不会真正改变。解决此问题的原因是：

this.authstate.signout().then(this.router.navigate(['/'])

Answer 2

两者之间有区别：

authState.subscribe((user: any) => {
  if (user) {
    // logged in
  }
});

和

onAuthStateChanged((user: any) => {
  if (user) {
    // logged in
  }
});

因为后者会在注销后返回正确的状态...

Angular / fire authState.subscribe不响应注销

auth.service.ts

nav.component.ts

2 个答案: