AngularFire2 - 如何在页面刷新后保持登录状态 [英] AngularFire2 - How to maintain logged in state after page refresh

问题描述

我将 AngularFire2 用于一个应用程序，并且我已经使用 Firebase 获得了注册/登录功能，但是，每次刷新页面时，登录状态都会重置并且不会持续存在.我无法找到执行此操作的功能，尽管我觉得我缺少一些非常小的东西.

I'm using AngularFire2 for an app and I've gotten the registration/login functionality working with Firebase, however, every time I refresh the page, the logged in state is reset and won't persist. I can't quite find functionality to do this, though I feel I'm missing something very small.

我可以使用 AngularFireAuth 来检查页面加载情况吗?

Can I use the AngularFireAuth to check on page load somewhere?

这是我的身份验证提供程序代码:

Here is my auth provider code:

import { Injectable } from '@angular/core';
import {Observable, Subject, BehaviorSubject} from "rxjs/Rx";
import {AngularFireAuth, FirebaseAuthState} from "angularfire2";
import {AuthInfo} from "./auth-info";
import {Router} from "@angular/router";

@Injectable()
export class AuthService {


  static UNKNOWN_USER = new AuthInfo(null);

  authInfo$: BehaviorSubject<AuthInfo> = new BehaviorSubject<AuthInfo>(AuthService.UNKNOWN_USER);


  constructor(private auth: AngularFireAuth, private router:Router) {

  }

    login(email, password):Observable<FirebaseAuthState> {
        return this.fromFirebaseAuthPromise(this.auth.login({email, password}));
    }


    signUp(email, password) {
        return this.fromFirebaseAuthPromise(this.auth.createUser({email, password}));
    }


    fromFirebaseAuthPromise(promise):Observable<any> {

        const subject = new Subject<any>();

        promise
            .then(res => {
                    const authInfo = new AuthInfo(this.auth.getAuth().uid);
                    this.authInfo$.next(authInfo);
                    subject.next(res);
                    subject.complete();
                },
                err => {
                    this.authInfo$.error(err);
                    subject.error(err);
                    subject.complete();
                });

        return subject.asObservable();
    }


    logout() {
        this.auth.logout();
        this.authInfo$.next(AuthService.UNKNOWN_USER);
        this.router.navigate(['/login']);

    }

}

提前致谢！

推荐答案

AngularFireAuth 是一个 observable 并发出 FirebaseAuthState 值.如果用户登录并刷新页面，AngularFireAuth 将发出经过身份验证的 FirebaseAuthState；否则，它将发出 null.

AngularFireAuth is an observable and emits FirebaseAuthState values. If a user is signed in and the page is refreshed, AngularFireAuth will emit an authenticated FirebaseAuthState; otherwise, it will emit null.

这样的事情应该接近解决您的问题:

So something like this should come close to solving your problem:

constructor(private auth: AngularFireAuth, private router:Router) {

  auth.subscribe((authState) => {
    if (authState) {
      const authInfo = new AuthInfo(authState.uid);
      this.authInfo$.next(authInfo);
    }
  });
}

这篇关于AngularFire2 - 如何在页面刷新后保持登录状态的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！