Можно ли охранять метод в Angular?

Question

Мне было интересно, можно ли защитить метод в приложении Angular вместо маршрута. Допустим, у вас есть кнопка, если вы нажмете ее и не войдете в систему, вы будете перенаправлены на страницу входа.

спасибо

Answer 1

Нет таких охранников для методов. Вместо этого наиболее вероятным решением для вас является создание условной проверки в методе, который вы хотите защитить.

Например, если необходимо защитить метод checkoutCart () и у вас есть приложение в вашем приложении angular, которое сообщает вам, вошел ли пользователь в систему или нет. Тогда это то, что вы можете сделать внутри метода checkoutCart () :

checkoutCart() {
   if ( !this._authenticationService.isLoggedIn ) {
      this.router.navigate(['/', 'login']).then(nav => {
         console.log(nav); // true if navigation is successful
      }, err => {
         console.log(err) // when there's an error
       });

      return;
   }

   // REST OF YOUR PROTECTED CODE
}

Чтобы узнать, как работает маршрутизатор, вы можете обратиться к: https://alligator.io/angular/navigation-routerlink-navigate-navigatebyurl/

Answer 2

Вот рабочий пример. Основной лог c находится в аутентификации, где, если он не авторизован, мы перенаправляем на страницу авторизации.

canActivate(next: ActivatedRouteSnapshot,
    state: RouterStateSnapshot): Observable<boolean> {
    let url: string = state.url;
    return this.loggedInService.isLoggedIn$.pipe(map(data => {
      if(!data) {
        this.router.navigate(['login']);
      }
      return data;
    }));
  }

Пример Stackblitz