Как основать canActivate () Guard на результате запроса HTTP GET? - PullRequest
0 голосов
/ 27 июня 2019

Я пытаюсь добавить защиту canActivate() для компонента Dashboard в моем приложении Angular.

В настоящее время сторож возвращает true, если пользователь вводит любой имя пользователя и пароль в форме входа.

Вот это canActivate() Guard:

canActivate(
    next: ActivatedRouteSnapshot,
    state: RouterStateSnapshot): Observable<boolean> | Promise<boolean> | boolean {
    return this.checkLoggedIn();
  }

  checkLoggedIn(): boolean {
    if (this.authService.isLoggedIn) {
      return true;
    }
    this.router.navigate(['/login']);
    return false;
  }

Вот метод login() в моем файле Typescript:

login(loginForm: NgForm) {
    if (loginForm && loginForm.valid) {
      const userName = loginForm.form.value.userName;
      const password = loginForm.form.value.password;
      this.authService.login(userName, password);

      // Navigate to the Dashboard after log in.
      this.router.navigate(['/dashboard']);
    } else {
      this.errorMessage = 'Please enter a user name and password.';
    }
  }

А вот и мой authService:

get isLoggedIn(): boolean {
    return !!this.currentUser;
  }

login(userName: string, password: string): void {
    if (!userName || !password) {
      return;
    }
    if (userName === 'admin') {
      this.currentUser = {
        id: 1,
        userName: userName,
        isAdmin: true
      };
      return;
    }
    this.currentUser = {
      id: 2,
      userName: userName,
      isAdmin: false
    };
  }

Вместо этой функции я хочу найти Employees.json, файл, который я размещаю на сервере.

Ниже приведен код моего Employee Service:

baseUrl = 'http://localhost:3000/employees';

getEmployee(id: number): Observable<IEmployee> {
        return this.httpClient.get<IEmployee>(`${this.baseUrl}/${id}`)
            .pipe(catchError(this.handleError));
    }

getEmployees(): Observable<IEmployee[]> {
        return this.httpClient.get<IEmployee[]>(this.baseUrl)
            .pipe(catchError(this.handleError));
    }

Может кто-нибудь сказать, как я могу использовать введенные пользователем имя пользователя и пароль, чтобы проверить, существуют ли имя пользователя и пароль в employees.json?

Также, вот структура Employee объектов:

export interface IEmployee {
  id: number;
  username: string;
  password: string;
}
...