Маршрутизатор AuthGuard угловой

Question

Я пытаюсь сделать постоянный вход в систему, и все работает нормально, за исключением случаев, когда я перезагружаю страницу со сводной панели, которая является страницей, защищенной AuthGuard, я перенаправляюсь на страницу входа, но все же я вошел в систему, а также navbar работает должным образом.Любые предложения очень мне помогут.

export class AuthGuard implements CanActivate {

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

    }

    canActivate(
        next: ActivatedRouteSnapshot,
        state: RouterStateSnapshot): Observable<boolean> | Promise<boolean> | boolean {
        return this.auth.getLoggedIn
            .pipe(
                map((res: boolean) => {
                    console.log(res);  // this one returns false when I reload page    
                    if (!res) {
                        this.router.navigate(['login']);
                        return false;
                    }
                    return true;
                })
            );
    }
}

Ниже мой сервис аутентификации

export class AuthService {

    private loggedIn: BehaviorSubject<boolean>;

    constructor(private http: HttpClient) {

        this.loggedIn = new BehaviorSubject<boolean>(false);
    }

    setLoggedIn(value: boolean) {
        this.loggedIn.next(value);
    }

    get getLoggedIn() {
        this.updatelogin().subscribe(res => {
            this.loggedIn.next(res);

        })
        return this.loggedIn.asObservable();
    }

    updatelogin() {
        return this.http.get<boolean>('/api/islogged'); // API server returns a boolean by calling req.isAuthenticated()-passport
    }
}

Я удалил ненужный код, но если вам понадобится что-то еще, дайте мне знать, и я отредактирую свойпочта.

Answer 1

Простое использование Subject вместо BehaviorSubject должно решить проблему:

Вы начинаете с создания объекта BehaviorSubject со значением false

this.loggedIn = new BehaviorSubject<boolean>(false);

Затем вы делаете HTTP-вызов, чтобы выдать новое значение

this.updatelogin().subscribe(res =>{
   this.loggedIn.next(res);
 })

Но вы не ждете завершения этого вызова, чтобы вернуть значение

return this.loggedIn.asObservable();