Különbségek

A kiválasztott változat és az aktuális verzió közötti különbségek a következők.

--- oktatas:web:angular:angular_utvonalak_vedelme [2023/02/15 13:16]
admin létrehozva
+++ oktatas:web:angular:angular_utvonalak_vedelme [2023/02/15 13:20]
admin [Guard]
@@ Sor 4: / Sor 4: @@
   * **Szerző:** Sallai András
-  * Copyright (c) Sallai András, 2021, 2022
+  * Copyright (c) Sallai András, 2023
   * Licenc: [[https://creativecommons.org/licenses/by-sa/4.0/|CC Attribution-Share Alike 4.0 International]]
   * Web: https://szit.hu
-===== Laravel =====
+===== Guard =====
+Az egyes útvonalak védelméről a guard nevű eszközzel tudunk gondoskodni.
+A shared nevű könyvtárban fogom létrehozni (nem kötelező itt létrehozni):
+  ng g guard shared/auth
+Létrehozáskor rákérdez milyen típusokat szeretnénk:
+<code>
+>(*) CanActivate
+ ( ) CanActivateChild
+ ( ) CanDeactivate
+ ( ) CanLoad
+</code>
+A szóközzel jelölhetek ki, a le és fel billentyűvel választhatok, az Enter billentyűre továbblép.
+Szükségünk van egy metódusra, ami megmondja, hogy azonosítva vagyunk-e.
+<code javascript auth.service.ts>
+  isLoggedIn() {
+    if (localStorage.getItem('currentUser') === null) {
+      return false;
+    }
+    return true;
+  }
+</code>
+<code javascript auth.guard.ts>
+import { Injectable } from '@angular/core';
+import { ActivatedRouteSnapshot, CanActivate } from '@angular/router';
+import { Router, RouterStateSnapshot, UrlTree } from '@angular/router';
+import { Observable } from 'rxjs';
+import { AuthService } from './auth.service';
+@Injectable({
+  providedIn: 'root'
+})
+export class AuthGuard implements CanActivate {
+  constructor(
+    private auth: AuthService,
+    private router: Router
+    ) {}
+  canActivate()
+      route: ActivatedRouteSnapshot,
+      state: RouterStateSnapshot): Observable<boolean | UrlTree> | Promise<boolean | UrlTree> | boolean | UrlTree {
+    if( this.auth.isLoggedIn() ) {
+      return true;
+    }
+    this.router.navigate(['login']);
+    return false;
+  }
+}
+</code>
+<code javascript app-routing.module.ts>
+const routes: Routes = [
+  {
+    path: 'students',
+    component: StudentComponent,
+    canActivate: [AuthGuard]
+  },
+  {path: '**', component: NopageComponent}
+];
+</code>

szit

Felhasználói eszközök

Eszközök a webhelyen

Különbségek

Eszközök az oldalon