初始加载时的 canActivate 失败未按预期重定向

Question

我有一个路由守卫来检查用户当前是否登录：

import {Injectable} from "@angular/core"
import {CanActivate} from "@angular/router"

import {Observable} from "rxjs/Observable"
import {UserService} from "./user.service"

@Injectable()
export class LoggedInGuard implements CanActivate {
    constructor (private userService: UserService) {}

    canActivate (): Observable<boolean> {
        return this.userService.getLoginStatus()
    }
}

user.service:

import {Injectable} from "@angular/core"
import {Router} from "@angular/router"

import {Observable} from "rxjs/Observable"
import {AngularFireAuth} from "angularfire2/auth"
import * as firebase from "firebase/app"

@Injectable()
export class UserService {
    private user: firebase.User

    constructor (private router: Router, private afAuth: AngularFireAuth) {
        this.afAuth.authState.subscribe(user => {
            this.user = user
        })
    }

    public login (email: string, password: string) {
        this.afAuth.auth.signInWithEmailAndPassword(email, password).then(user => {
            this.user = user
            this.router.navigateByUrl("/dashboard")
        })
    }
    public logout () {
        this.afAuth.auth.signOut()
    }
    public getLoginStatus (): Observable<boolean> {
        return this.afAuth.authState.map(Boolean)
    }
}

以及从 / 到 /login 的重定向：

{path: "", redirectTo: "login", pathMatch: "full"}

当用户登录时一切正常，或者如果我直接导航到 / 或 /login（前者正确重定向到后者）。但是，如果我在未登录的情况下尝试导航到受保护的路线，它会将我重定向到 /，但它不会再次重定向，而是停在空白页面上。

是否有第二个重定向不起作用的原因？或者更好的做法是让警卫直接转到 /login，但我不确定如何在可观察的上下文中做到这一点。

Answer 1

我不确定您的方法是否可行，但作为解决方法，您可以在 LoggedInGuard 中简单地调用 this.router.navigate(['/login']) if getLoginStatus() returns false。

@看例子：

初始加载时的 canActivate 失败未按预期重定向

canActivate failure on initial load not redirecting as expected

typescript

angular2-routing

angular