我是Firebase的新手,我正尝试从angular 7应用程序实现身份验证。
这是我的身份验证服务:
@Injectable({
providedIn: 'root'
})
export class AuthService {
private user: Observable<firebase.User>;
private userDetails: firebase.User;
constructor(private angularFireAuth: AngularFireAuth) {
this.user = this.angularFireAuth.user;
this.user.subscribe(
(user) => {
if (user) {
this.userDetails = user;
}
else {
this.userDetails = null;
}
}
);
}
signInGoogleLogin() {
return this.angularFireAuth.auth.setPersistence(firebase.auth.Auth.Persistence.LOCAL)
.then(() =>
this.angularFireAuth.auth.signInWithPopup(
new firebase.auth.GoogleAuthProvider()
)
);
}
isLoggedIn(): boolean {
return this.userDetails != null;
}
}
这是我的AuthGuard实现:
@Injectable({
providedIn: 'root'
})
export class AuthGuard implements CanActivate {
constructor(private router: Router, private authService: AuthService) { }
canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot):
Observable<boolean> | Promise<boolean> | boolean {
if (this.authService.isLoggedIn()) {
return true;
}
this.router.navigate(['login'], { queryParams: { returnUrl: state.url}});
return false;
}
}
我的问题是:持久性似乎不起作用。每当我刷新页面时,我都必须登录,每当导航到另一个需要身份验证的组件时,我都需要再次登录。
当然,如果我使用“ signInWithRedirect”而不是“ signInWithPopup”,我将进入一个日志记录循环,在该循环中,我被重定向到我的登录页面,该页面发现我尚未登录,然后尝试登录我,将我重定向到我的登录页面,发现我尚未登录,依此类推。
我认为所有这些问题实际上都与同一个问题有关:我的身份验证状态持久性实现有些错误。
所以我的问题很简单:我在做什么错了?:)
我希望能够登录,然后在刷新时保持登录状态。
谢谢您的帮助。 :)
如果有人来这里寻找答案,这就是我的做法
export class AuthGuard implements CanActivate {
constructor(
private _fAuth: AngularFireAuth,
private _router: Router
) {}
canActivate(
next: ActivatedRouteSnapshot,
state: RouterStateSnapshot): Observable<boolean | UrlTree> {
return this._authService.fAuth.authState.pipe(
first(),
map(user => !!user),
tap(authenticated => {
console.log("auth guard loggedin", authenticated);
authenticated || this._router.parseUrl('/auth/login')
})
)
}
}