Реализация canActivate Auth Guard в угловых

Question

У меня есть служба с этой функцией, которая возвращает true или false, а токен не действителен

loggedIn() {
return this.http.get('http://localhost:3000/users/validateToken')
  .map(res => res.json()).map(data => data.success);
}

У меня есть проверка подлинности с может активировать на защищенных маршрутах, которые используют это.

  canActivate(){
    this.authService.loggedIn().subscribe(res => {
      if(res) {
        return true;
      }
      else {
        this.router.navigate(['/login'])
        return false;
      }
    })
  }

Но я получаю эту ошибку.

неправильно реализует интерфейс "CanActivate". Типы свойств canActivate несовместимы. Тип '() => void' нельзя назначить типу (route: ActivatedRouteSnapshot, состояние: RouterStateSnapshot) => boolean | Обещание | Obser...'. Тип 'void' не может быть назначен типу 'boolean | Обещание | Наблюдаемое.

Как я могу реализовать то, что я пытаюсь сделать здесь?

Answer 1

canActivate Функция должна возвращать логическое значение, обещание логического значения или наблюдаемое логического значения.

В вашем случае вы ничего не возвращаете. Возможно, потому что вы опускали return в вашей функции.

Но это не сработает, если вы добавите его, потому что тогда вы вернете подписку, которая не будет принята подписью.

Что вы могли бы сделать это:

canActivate() {
  return this.authService.loggedIn().map(res => {
    if(!res) {
      this.router.navigate(['/login']);
    }
    return res;
  });
}

С помощью этого кода вы соблюдаете подпись и сохраняете логику маршрутизации.