added auth.guard & clean code

This commit is contained in:
Chneemann 2024-09-01 10:02:10 +02:00
parent 3f013da226
commit 3f91be07a2
19 changed files with 99 additions and 14 deletions

View file

@ -1,8 +1,8 @@
import { Routes } from '@angular/router';
import { SummaryComponent } from './components/summary/summary.component';
import { HelpComponent } from './shared/components/legal-informations/help/help.component';
import { ImprintComponent } from './shared/components/legal-informations/imprint/imprint.component';
import { PrivacyPolicyComponent } from './shared/components/legal-informations/privacy-policy/privacy-policy.component';
import { HelpComponent } from './shared/components/legal-information/help/help.component';
import { ImprintComponent } from './shared/components/legal-information/imprint/imprint.component';
import { PrivacyPolicyComponent } from './shared/components/legal-information/privacy-policy/privacy-policy.component';
import { AddTaskComponent } from './components/add-task/add-task.component';
import { BoardComponent } from './components/board/board.component';
import { ContactsComponent } from './components/contacts/contacts.component';
@ -12,6 +12,7 @@ import { LoginComponent } from './components/login/login.component';
import { RegisterComponent } from './components/login/register/register.component';
import { ForgotPwComponent } from './components/login/forgot-pw/forgot-pw.component';
import { PwResetComponent } from './components/login/forgot-pw/pw-reset/pw-reset.component';
import { AuthGuard } from './auth.guard';
export const routes: Routes = [
{ path: '', component: LoginComponent },
@ -22,14 +23,30 @@ export const routes: Routes = [
{ path: 'register', component: RegisterComponent },
{ path: 'forgot-pw', component: ForgotPwComponent },
{ path: 'pw-reset', component: PwResetComponent },
{ path: 'summary', component: SummaryComponent },
{ path: 'add-task', component: AddTaskComponent },
{ path: 'add-task/:id', component: AddTaskComponent },
{ path: 'board', component: BoardComponent },
{ path: 'task/:id', component: TaskOverlayComponent },
{ path: 'task-edit/:id', component: TaskEditOverlayComponent },
{ path: 'contacts', component: ContactsComponent },
{ path: 'help', component: HelpComponent },
{ path: 'imprint', component: ImprintComponent },
{ path: 'privacy-policy', component: PrivacyPolicyComponent },
{ path: 'summary', component: SummaryComponent, canActivate: [AuthGuard] },
{ path: 'add-task', component: AddTaskComponent, canActivate: [AuthGuard] },
{
path: 'add-task/:id',
component: AddTaskComponent,
canActivate: [AuthGuard],
},
{ path: 'board', component: BoardComponent, canActivate: [AuthGuard] },
{
path: 'task/:id',
component: TaskOverlayComponent,
canActivate: [AuthGuard],
},
{
path: 'task-edit/:id',
component: TaskEditOverlayComponent,
canActivate: [AuthGuard],
},
{ path: 'contacts', component: ContactsComponent, canActivate: [AuthGuard] },
{ path: 'help', component: HelpComponent, canActivate: [AuthGuard] },
{ path: 'imprint', component: ImprintComponent, canActivate: [AuthGuard] },
{
path: 'privacy-policy',
component: PrivacyPolicyComponent,
canActivate: [AuthGuard],
},
];

View file

@ -0,0 +1,17 @@
import { TestBed } from '@angular/core/testing';
import { CanActivateFn } from '@angular/router';
import { authGuard } from './auth.guard';
describe('authGuard', () => {
const executeGuard: CanActivateFn = (...guardParameters) =>
TestBed.runInInjectionContext(() => authGuard(...guardParameters));
beforeEach(() => {
TestBed.configureTestingModule({});
});
it('should be created', () => {
expect(executeGuard).toBeTruthy();
});
});

29
src/app/auth.guard.ts Normal file
View file

@ -0,0 +1,29 @@
import { Injectable } from '@angular/core';
import { Router } from '@angular/router';
import { Observable, of } from 'rxjs';
import { map, catchError } from 'rxjs/operators';
import { LoginService } from './services/login.service';
@Injectable({
providedIn: 'root',
})
export class AuthGuard {
constructor(private loginService: LoginService, private router: Router) {}
canActivate(): Observable<boolean> | Promise<boolean> | boolean {
return this.loginService.checkAuthUser().pipe(
map((isAuthenticated) => {
if (isAuthenticated) {
return true;
} else {
this.router.navigate(['/']);
return false;
}
}),
catchError(() => {
this.router.navigate(['/']);
return of(false);
})
);
}
}

View file

@ -55,6 +55,7 @@
autocomplete="current-password"
pattern="[^<>]*"
[(ngModel)]="loginData.password"
minlength="6"
required
/>
@if(!loginData.password) {

View file

@ -13,6 +13,7 @@ import { Task } from '../interfaces/task.interface';
import { User } from '../interfaces/user.interface';
import CryptoES from 'crypto-es';
import { CryptoESSecretKey } from './../environments/config';
import { Observable, of } from 'rxjs';
@Injectable({
providedIn: 'root',
@ -172,6 +173,18 @@ export class FirebaseService implements OnDestroy {
}
}
// ------------- AUTH ------------- //
getAuthUser(): Observable<any> {
const encryptedValue = localStorage.getItem('currentUserJOIN');
if (encryptedValue) {
const bytes = CryptoES.AES.decrypt(encryptedValue, this.secretKey);
const decryptedValue = bytes.toString(CryptoES.enc.Utf8);
return of(JSON.parse(decryptedValue));
}
return of(null);
}
ngOnDestroy() {
this.unsubTask();
this.unsubUser();

View file

@ -24,6 +24,7 @@ import { User } from '../interfaces/user.interface';
import { Router } from '@angular/router';
import CryptoES from 'crypto-es';
import { CryptoESSecretKey } from './../environments/config';
import { catchError, map, Observable, of } from 'rxjs';
@Injectable({
providedIn: 'root',
@ -42,6 +43,13 @@ export class LoginService {
private router: Router
) {}
checkAuthUser(): Observable<boolean> {
return this.firebaseService.getAuthUser().pipe(
map((user) => !!user),
catchError(() => of(false))
);
}
login(loginData: { mail: string; password: string }) {
signInWithEmailAndPassword(getAuth(), loginData.mail, loginData.password)
.then((userCredential) => {

View file

@ -10,7 +10,7 @@
"errorMail1": "Diese E-Mail Adresse existiert nicht!",
"errorMail2": "Dies ist kein gültiges E-Mail-Format!",
"errorPassword0": "Sie müssen ein Passwort eingeben!",
"errorPassword1": "Das Passwort stimmt nicht mit der E-Mail Adresse überein!",
"errorPassword1": "Das Passwort passt nicht zur E-Mail-Adresse!",
"loginDialog0": "Einloggen",
"loginDialog1": "Bitte warten..."
},