Implement AuthGuard for route protection, integrate authorization checks into particles route, and simplify HeaderComponent access logic. Remove redundant debug logging in auth.service.ts.

This commit is contained in:
akastijn 2025-08-02 22:27:37 +02:00
parent 7f1c59d102
commit 1f03a4bdc3
4 changed files with 50 additions and 10 deletions

View File

@ -1,4 +1,5 @@
import {Routes} from '@angular/router'; import {Routes} from '@angular/router';
import {AuthGuard} from './guards/auth.guard';
export const routes: Routes = [ export const routes: Routes = [
{ {
@ -7,7 +8,11 @@ export const routes: Routes = [
}, },
{ {
path: 'particles', path: 'particles',
loadComponent: () => import('./pages/particles/particles.component').then(m => m.ParticlesComponent) loadComponent: () => import('./pages/particles/particles.component').then(m => m.ParticlesComponent),
canActivate: [AuthGuard],
data: {
requiredAuthorizations: ['SCOPE_head_mod']
}
}, },
{ {
path: 'map', path: 'map',

View File

@ -0,0 +1,41 @@
import {Injectable} from '@angular/core';
import {ActivatedRouteSnapshot, CanActivate, Router, RouterStateSnapshot, UrlTree} from '@angular/router';
import {Observable} from 'rxjs';
import {AuthService} from '@services/auth.service';
@Injectable({
providedIn: 'root'
})
export class AuthGuard implements CanActivate {
constructor(
private authService: AuthService,
private router: Router
) {
}
canActivate(
route: ActivatedRouteSnapshot,
state: RouterStateSnapshot
): Observable<boolean | UrlTree> | Promise<boolean | UrlTree> | boolean | UrlTree {
if (!this.authService.checkAuthStatus()) {
return this.router.createUrlTree(['/']);
}
const requiredAuthorizations = route.data['requiredAuthorizations'] as string[];
if (!requiredAuthorizations || requiredAuthorizations.length === 0) {
return true;
}
const userAuthorizations = this.authService.getUserAuthorizations();
const hasAccess = requiredAuthorizations.some(auth => userAuthorizations.includes(auth));
if (!hasAccess) {
return this.router.createUrlTree(['/']);
}
return true;
}
}

View File

@ -141,11 +141,9 @@
<li class="nav_li"> <li class="nav_li">
<a [id]="getCurrentPageId(['particles'])" <a [id]="getCurrentPageId(['particles'])"
class="nav_link fake_link" [ngClass]="active">Special</a> class="nav_link fake_link" [ngClass]="active">Special</a>
@if (hasAccess(['SCOPE_head_mod'])) {
<ul class="dropdown"> <ul class="dropdown">
<li class="nav_li"><a class="nav_link2" [routerLink]="['/particles']">Particles</a></li> <li class="nav_li"><a class="nav_link2" [routerLink]="['/particles']">Particles</a></li>
</ul> </ul>
}
</li> </li>
} }
@if (!isAuthenticated) { @if (!isAuthenticated) {

View File

@ -105,15 +105,11 @@ export class AuthService {
*/ */
public getUserAuthorizations(): string[] { public getUserAuthorizations(): string[] {
const claims = this.userClaimsSubject.getValue(); const claims = this.userClaimsSubject.getValue();
console.log("Retrieved user claims: ", claims);
return claims?.authorities || []; return claims?.authorities || [];
} }
public hasAccess(requiredAuthorizations: string[]): boolean { public hasAccess(requiredAuthorizations: string[]): boolean {
const userAuthorizations = this.getUserAuthorizations(); const userAuthorizations = this.getUserAuthorizations();
console.log("Required: ", requiredAuthorizations);
console.log("Auth: ", userAuthorizations);
console.log("hasAccess: ", requiredAuthorizations.some(auth => userAuthorizations.includes(auth)));
return requiredAuthorizations.some(auth => userAuthorizations.includes(auth)); return requiredAuthorizations.some(auth => userAuthorizations.includes(auth));
} }
} }