Route Guards в Angular - действительно мощный и полезный инструмент, когда вы хотите контролировать навигацию пользователя.

при создании приложений могут быть некоторые области, к которым мы хотим запретить доступ для определенных пользователей. Маршрутизатор Angular 2 поставляется с мощной функцией, называемой route gaurd, которая позволяет нам программно определять, может ли пользователь получить доступ к маршруту или нет.

Есть четыре типа охранников, которые помогают нам защищать наши маршруты:

  1. CanActivate  этот защитник помогает решить, можно ли активировать маршрут.
  2. CanActivateChild  этот охранник помогает решить, можно ли активировать дочерние маршруты маршрута.
  3. CanDeactivate  эта защита помогает решить, можно ли деактивировать маршрут.
  4. CanLoad  эта защита помогает решить, можно ли загружать модуль лениво или нет.

CanActivate

CanActive Guard помогает решить, можно ли активировать маршрут. Например, мы можем захотеть, чтобы некоторые маршруты были доступны только после входа пользователя в систему.

Чтобы использовать охранников маршрута, мы должны зарегистрировать их на определенных маршрутах.

export const appRoutes: Routes = [
  {
    path: 'dashboard',
    children: [
      {
        path: '',
        canActivate: [AuthGuard],
        component: DashboardComponent
      }
}
]

Давайте посмотрим на пример, активируйте Guard, который проверяет, вошел ли пользователь в систему. Этот класс реализует интерфейс canActive, реализуя функцию canActive.

export class LoginRouteGuard implements CanActivate {

  constructor(private loginService: LoginService) {}

  canActivate() {
    return this.loginService.isLoggedIn();
  }
}

Когда canActive возвращает true, пользователь может активировать маршрут. Когда canActive возвращает false, пользователь не может получить доступ к маршруту.

CanDeactivate

Охранники CanDeactivate могут контролировать, может ли пользователь покинуть определенный маршрут.

Например, предположим, что пользователь ввел информацию в форму на странице, но не отправил ее. Если бы они покинули страницу, они потеряли бы информацию. Возможно, мы захотим уведомить пользователя, если пользователь попытается покинуть маршрут, не отправив или не сохранив информацию.

CanLoad

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

Добавьте canLoad guard, который загружает модуль администратора только после того, как пользователь вошел в систему и пытается получить доступ к области функций администратора.

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