Angular 2+ Firebase 认证 - 设置登录状态持久化

Question

我已经在一个 Angular 应用的认证服务中使用 Firebase 设置了身份验证，并且我正在尝试确保成功登录后会话状态持久化。

我看到 Firebase 默认应该具有状态持久性，但是当前应用程序中的登录仅持续到页面刷新之前，之后又需要重新登录，这似乎不对。

我知道我必须使用 statePersistence 方法，如文档所示，但是这并没有清楚地说明如何将其实现到 Angular 2+ 应用的登录/认证服务中。

我该如何将 session statePersistence 实现到以下认证服务中？

auth.service.ts

import { Injectable } from '@angular/core';
import { Router } from '@angular/router';
import { Observable } from 'rxjs/Observable';
import * as firebase from 'firebase/app';
import { AngularFireAuth } from 'angularfire2/auth';

@Injectable()

export class AuthService {

  private user: Observable<firebase.User>;

  isAuthenticated: boolean = false;

  constructor(private firebaseAuth: AngularFireAuth, private router: Router) {
    this.user = firebaseAuth.authState;
  }

  signIn(email: string, password: string) {
    this.firebaseAuth
        .auth
        .signInWithEmailAndPassword(email, password)
        .then(value => {
            console.log('Signed In');
            this.isAuthenticated = true;
            this.router.navigateByUrl('/dashboard');
        })
        .catch(err => {
            console.log('Sign-In Error: ', err.message);
        });
  }

  signInGoogle() {
    return this.firebaseAuth.auth.signInWithPopup(
        new firebase.auth.GoogleAuthProvider()
    )
  }

- nick.cook

---

你得到任何解决方案了吗？ - Abubakker Moallim

Answer 1

你正在导入整个 firebase 模块。只需导入 auth。以下代码对我有效：

// Don't import the whole module, only `auth`.
import { auth } from 'firebase/app';

constructor(private readonly afAuth: AngularFireAuth) { }

signIn() {
  this.afAuth.auth.setPersistence(auth.Auth.Persistence.LOCAL).then(() => {
    // Now sign-in using your chosen method.
    return this.afAuth.auth.signInAnonymously();
  }).catch((error) => {
    // Handle errors here.
    let errorCode = error.code;
    let errorMessage = error.message;
    console.error(errorCode, errorMessage);
  });
}

- Jack

Answer 2

添加

this.firebaseAuth
    .auth

    .setPersistence(firebase.auth.Auth.Persistence.LOCAL)

    .signInWithEmailAndPassword(email, password)

- Paul

---

好的，请提供需要翻译的内容。如果您需要我添加解释，请在翻译请求中注明。 - Harshith Rai

Answer 3

很可能您没有使用onAuthStateChanged监听器来检测页面加载时的初始身份验证状态。

firebase.auth().onAuthStateChanged(user => {
  if (user) {
    // User signed in.
  } else {
    // User not signed in.
  }
});

- bojeil

---

谢谢，但这并没有真正回答我的问题。我不知道这应该放在我上面提供的代码中的哪里。 - nick.cook