Guard

Ezzel lehet biztosítani, hogy egy oldalt jogosultság nélkül ne lehessen megtekinteni.

A guard-ok jogosultság ellenőrzésére szolgálnak. Egy guard egy interfészt valósít meg, amely ellenőrzi, hogy egy útvonal megtekinthető-e vagy sem.

Típusai:

• CanActivate: Ellenőrzi, hogy egy útvonal megtekinthető-e.
• CanDeactivate: Ellenőrzi, hogy el lehet-e hagyni az aktuális útvonalat.
• CanLoad: Ellenőrzi, hogy egy késleltetett betöltésű modult betölthetünk-e.

Ezek a guard-ok gyakran az autentikáció és az autorizáció ellenőrzésére használatosak.

auth.guard.ts

import { inject } from '@angular/core';
import { CanActivateFn, Router } from '@angular/router';

export const AuthGuard: CanActivateFn = (route, state) => {
  const token = localStorage.getItem('token');
  const router = inject(Router);
  console.log('token: ', token);
  if (token) {
    return true;
  } else {
    router.navigate(['/login']);
    return false;
  }
};

Angular <15

auth.guard.ts

import { Injectable } from '@angular/core';
import { CanActivate, ActivatedRouteSnapshot, RouterStateSnapshot, Router } from '@angular/router';

@Injectable({
  providedIn: 'root'
})
export class AuthGuard implements CanActivate {
  
  constructor(private router: Router) {}

  canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): boolean {
    const token = localStorage.getItem('token');
    console.log('token: ', token);
    if (token) {
      return true;
    } else {
      this.router.navigate(['/login']);
      return false;
    }
  }
}

router-module.ts

{
    path: 'dashboard',
    component: DashboardComponent,
    canActivate: [AuthGuard],
  },