Question

我在Angular应用中使用NGRX，并且尝试使用身份验证防护。当应用启动时，我调度一个从服务器（firebase）获取身份验证状态的操作。问题是，如果我直接转到由auth防护程序保护的链接，则默认的auth状态为false，以便返回并重定向到登录页面。

这是我的canActivate方法

canActivate() {
        return this.store.select(fromAuth.getAuthenticatedStatus).pipe(
            //filter(isAuth => isAuth == true || isAuth == false),
            take(1),
            map((isAuth: boolean) => isAuth),
            catchError(() => of(false))
        )
    }

有没有办法等到服务器返回身份验证状态之后再检查商店的身份验证状态？我已经尝试过滤并删除了take运算符，但似乎没有用。

我不想将对服务器的调用置于auth Guard中，因为我不想每次切换页面时都对服务器进行检查。

Answer 1

您有：

@Injectable()
export class LoggedGuard implements CanActivate {

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

    canActivate() {
        return this.auth.authState.pipe(
            take(1),
            map(user => !!user), // !! convert User object to boolean value
            tap(isLogged => {
                if(!isLogged) {
                    this.router.navigate(['/login'])
                    console.log("You are not logged in. You cannot access route.")
                }
            })
        )
    }
}

在这种情况下，我更愿意向Firebase发出请求，以获取不从商店获取的全新身份验证状态。如果您为有某些主张的人提供保护，这一点就更为重要，因为如果您删除某个管理员，他可能仍然有较老的主张。

如果您将商店连接到浏览器中的某些“ LocalDatabase”，Firebase将拥有自己的IndexedDB，并且错误地您的应用程序将从本地检索数据，并且将不检查更新您甚至可以禁止无数次登录的用户甚至您禁止他并删除他的帐户

如何在NGRX中使用身份验证防护

1 个答案: