Rename and add interceptor; adjust service

This commit is contained in:
Peter Rossa
2023-05-11 13:06:17 +02:00
parent 54905ed995
commit 2ab8331640
6 changed files with 177 additions and 175 deletions

View File

@@ -1,39 +1,41 @@
import { NgModule } from "@angular/core";
import { BrowserModule, DomSanitizer } from "@angular/platform-browser";
import { NgModule } from '@angular/core';
import { BrowserModule, DomSanitizer } from '@angular/platform-browser';
import { FormsModule, ReactiveFormsModule } from "@angular/forms";
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
import { AppRoutingModule } from "./app-routing.module";
import { HttpClientModule } from "@angular/common/http";
import { AppComponent } from "./app.component";
import { LoginComponent } from "./components/loginPage/login.component";
import { IndexComponent } from "./components/indexPage/index.component";
import { DashboardComponent } from "./components/dashboard/dashboard.component";
import { MeterDataListComponent } from "./components/subcomponents/meter-data-list/meter-data-list.component";
import { ConsumptionLastYearComponent } from "./components/subcomponents/consumption-last-year/consumption-last-year.component";
import { MeterDataWrapperComponent } from "./components/subcomponents/meter-data-wrapper/meter-data-wrapper.component";
import { HeaderComponent } from "./components/header/header.component";
import { LoaderComponent } from "./components/loader/loader.component";
import { BrowserAnimationsModule } from "@angular/platform-browser/animations";
import { AppRoutingModule } from './app-routing.module';
import { HTTP_INTERCEPTORS, HttpClientModule } from '@angular/common/http';
import { AppComponent } from './app.component';
import { LoginComponent } from './components/loginPage/login.component';
import { IndexComponent } from './components/indexPage/index.component';
import { DashboardComponent } from './components/dashboard/dashboard.component';
import { MeterDataListComponent } from './components/subcomponents/meter-data-list/meter-data-list.component';
import { ConsumptionLastYearComponent } from './components/subcomponents/consumption-last-year/consumption-last-year.component';
import { MeterDataWrapperComponent } from './components/subcomponents/meter-data-wrapper/meter-data-wrapper.component';
import { HeaderComponent } from './components/header/header.component';
import { LoaderComponent } from './components/loader/loader.component';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { MatCardModule } from '@angular/material/card';
import { MatFormFieldModule } from '@angular/material/form-field';
import { MatInputModule } from '@angular/material/input';
import { MatSelectModule } from '@angular/material/select';
import { MatTableModule } from '@angular/material/table';
import { MatProgressBarModule } from '@angular/material/progress-bar';
import { MatToolbarModule } from '@angular/material/toolbar';
import { MatSidenavModule } from '@angular/material/sidenav';
import { MatIconModule, MatIconRegistry } from '@angular/material/icon';
import { MatListModule } from '@angular/material/list';
import { MatGridListModule } from '@angular/material/grid-list';
import { MatDialogModule } from '@angular/material/dialog';
import { MatButtonModule } from '@angular/material/button';
import { MatDatepickerModule } from '@angular/material/datepicker';
import { MatNativeDateModule } from '@angular/material/core';
import { MeterDataAddDialogComponent } from './dialogs/meter-data-add-dialog/meter-data-add-dialog.component';
import { SnackbarComponent } from './components/snackbar/snackbar.component';
import { MatSnackBarModule } from '@angular/material/snack-bar';
import { AuthInterceptor } from './components/interceptors/authInterceptor';
import { MatCardModule } from "@angular/material/card";
import { MatFormFieldModule } from "@angular/material/form-field";
import { MatInputModule } from "@angular/material/input";
import { MatSelectModule } from "@angular/material/select";
import { MatTableModule } from "@angular/material/table";
import { MatProgressBarModule } from "@angular/material/progress-bar";
import { MatToolbarModule } from "@angular/material/toolbar";
import { MatSidenavModule } from "@angular/material/sidenav";
import { MatIconModule, MatIconRegistry } from "@angular/material/icon";
import { MatListModule } from "@angular/material/list";
import { MatGridListModule } from "@angular/material/grid-list";
import { MatDialogModule } from "@angular/material/dialog";
import { MatButtonModule } from "@angular/material/button";
import { MatDatepickerModule } from "@angular/material/datepicker";
import { MatNativeDateModule } from "@angular/material/core";
import { MeterDataAddDialogComponent } from "./dialogs/meter-data-add-dialog/meter-data-add-dialog.component";
import { SnackbarComponent } from "./components/snackbar/snackbar.component";
import { MatSnackBarModule } from "@angular/material/snack-bar";
@NgModule({
declarations: [
AppComponent,
@@ -74,18 +76,18 @@ import { MatSnackBarModule } from "@angular/material/snack-bar";
],
providers: [
MatDatepickerModule,
// {
// provide: HTTP_INTERCEPTORS,
// useClass: HttpInterceptorService,
// multi: true,
// },
{
provide: HTTP_INTERCEPTORS,
useClass: AuthInterceptor,
multi: true,
},
],
bootstrap: [AppComponent],
})
export class AppModule {
constructor(matIconRegistry: MatIconRegistry, domSanitizer: DomSanitizer) {
matIconRegistry.addSvgIconSet(
domSanitizer.bypassSecurityTrustResourceUrl("./assets/mdi.svg")
domSanitizer.bypassSecurityTrustResourceUrl('./assets/mdi.svg')
);
}
}

View File

@@ -0,0 +1,57 @@
import {
HttpInterceptor,
HttpRequest,
HttpHandler,
HttpEvent,
HttpHeaders,
} from '@angular/common/http';
import { Injectable } from '@angular/core';
import { Observable } from 'rxjs';
import { AuthService } from 'src/app/auth/auth.service';
import { LoginService } from 'src/app/auth/login.service';
import { UserService } from 'src/app/services/user.service';
@Injectable()
export class AuthInterceptor implements HttpInterceptor {
constructor(
private authService: AuthService,
private loginService: LoginService
) {}
intercept(
req: HttpRequest<any>,
next: HttpHandler
): Observable<HttpEvent<any>> {
if (
this.authService.checkUserLoggedIn() &&
req.url.indexOf('authenticate') === -1
) {
console.log('if');
let jwtToken: String = this.loginService.getUserSecurityToken();
// headers: HttpHeaders = new HttpHeaders({
// authorization: "bearer " + jwtToken,
// }),
// options = { headers: headers };
const authReq = req.clone({
headers: new HttpHeaders({
'Content-Type': 'application/json',
authorization: 'bearer ' + jwtToken,
// headers: new HttpHeaders({
// 'Content-Type': 'application/json',
// Authorization: `Basic ${window.btoa(
// this.authenticationService.username +
// ':' +
// this.authenticationService.password
// )}`,
}),
});
console.log(authReq);
return next.handle(authReq);
} else {
console.log('else');
return next.handle(req);
}
}
}

View File

@@ -1,49 +0,0 @@
// import {
// HttpInterceptor,
// HttpRequest,
// HttpHandler,
// HttpEvent,
// HttpHeaders,
// } from '@angular/common/http';
// import { Injectable } from '@angular/core';
// import { Observable } from 'rxjs';
// import { AuthenticationService } from 'src/app/services/auth.service';
// @Injectable()
// export class HttpInterceptorService implements HttpInterceptor {
// constructor(private authenticationService: AuthenticationService) {}
// intercept(
// req: HttpRequest<any>,
// next: HttpHandler
// ): Observable<HttpEvent<any>> {
// console.log(
// this.authenticationService.username,
// this.authenticationService.password
// );
// if (
// this.authenticationService.isUserLoggedIn() &&
// req.url.indexOf('basicauth') === -1
// ) {
// console.log('if');
// const authReq = req.clone({
// headers: new HttpHeaders({
// 'Content-Type': 'application/json',
// Authorization: `Basic ${window.btoa('pezi:Password123!')}`,
// // headers: new HttpHeaders({
// // 'Content-Type': 'application/json',
// // Authorization: `Basic ${window.btoa(
// // this.authenticationService.username +
// // ':' +
// // this.authenticationService.password
// // )}`,
// }),
// });
// console.log(authReq);
// return next.handle(authReq);
// } else {
// console.log('else');
// return next.handle(req);
// }
// }
// }

View File

@@ -1,16 +1,16 @@
import { TestBed } from '@angular/core/testing';
// import { TestBed } from '@angular/core/testing';
import { AuthService } from './auth.service';
// import { AuthService } from './auth.service';
describe('AuthService', () => {
let service: AuthService;
// describe('AuthService', () => {
// let service: AuthService;
beforeEach(() => {
TestBed.configureTestingModule({});
service = TestBed.inject(AuthService);
});
// beforeEach(() => {
// TestBed.configureTestingModule({});
// service = TestBed.inject(AuthService);
// });
it('should be created', () => {
expect(service).toBeTruthy();
});
});
// it('should be created', () => {
// expect(service).toBeTruthy();
// });
// });

View File

@@ -1,65 +1,65 @@
import { HttpClient } from '@angular/common/http';
import { Injectable } from '@angular/core';
import { map } from 'rxjs/operators';
// import { HttpClient } from '@angular/common/http';
// import { Injectable } from '@angular/core';
// import { map } from 'rxjs/operators';
@Injectable({
providedIn: 'root',
})
export class AuthenticationService {
// BASE_PATH: 'http://localhost:8080'
USER_NAME_SESSION_ATTRIBUTE_NAME = 'authenticatedUser';
public username: string | undefined;
public password: string | undefined;
constructor(private http: HttpClient) {}
authenticationService(username: string, password: string) {
// return this.http
// .get(`http://localhost:8080/authenticate`, {
// // .get(`http://localhost:8080/`, {
// headers: {
// 'Content-Type': 'application/json',
// Authorization: this.createBasicAuthToken(username, password),
// },
// @Injectable({
// providedIn: 'root',
// })
return this.http
.post<any>('http://localhost:8080/hello', {
userName: username,
userPass: password,
})
.pipe(
map((res) => {
this.username = username;
this.password = password;
this.registerSuccessfulLogin(username, password);
})
);
}
// export class AuthenticationService {
// // BASE_PATH: 'http://localhost:8080'
// USER_NAME_SESSION_ATTRIBUTE_NAME = 'authenticatedUser';
createBasicAuthToken(username: string, password: string) {
return 'Basic ' + window.btoa(username + ':' + password);
}
// public username: string | undefined;
// public password: string | undefined;
registerSuccessfulLogin(username: string, password: string) {
sessionStorage.setItem(this.USER_NAME_SESSION_ATTRIBUTE_NAME, username);
}
// constructor(private http: HttpClient) {}
logout() {
sessionStorage.removeItem(this.USER_NAME_SESSION_ATTRIBUTE_NAME);
this.username = undefined;
this.password = undefined;
}
// authenticationService(username: string, password: string) {
// // return this.http
// // .get(`http://localhost:8080/authenticate`, {
// // // .get(`http://localhost:8080/`, {
// // headers: {
// // 'Content-Type': 'application/json',
// // Authorization: this.createBasicAuthToken(username, password),
// // },
// // })
// return this.http
// .post<any>('http://localhost:8080/hello', {
// userName: username,
// userPass: password,
// })
// .pipe(
// map((res) => {
// this.username = username;
// this.password = password;
// this.registerSuccessfulLogin(username, password);
// })
// );
// }
isUserLoggedIn() {
let user = sessionStorage.getItem(this.USER_NAME_SESSION_ATTRIBUTE_NAME);
if (user === undefined) return false;
return true;
}
// createBasicAuthToken(username: string, password: string) {
// return 'Basic ' + window.btoa(username + ':' + password);
// }
getLoggedInUserName() {
let user = sessionStorage.getItem(this.USER_NAME_SESSION_ATTRIBUTE_NAME);
if (user === undefined) return '';
return user;
}
}
// registerSuccessfulLogin(username: string, password: string) {
// sessionStorage.setItem(this.USER_NAME_SESSION_ATTRIBUTE_NAME, username);
// }
// logout() {
// sessionStorage.removeItem(this.USER_NAME_SESSION_ATTRIBUTE_NAME);
// this.username = undefined;
// this.password = undefined;
// }
// isUserLoggedIn() {
// let user = sessionStorage.getItem(this.USER_NAME_SESSION_ATTRIBUTE_NAME);
// if (user === undefined) return false;
// return true;
// }
// getLoggedInUserName() {
// let user = sessionStorage.getItem(this.USER_NAME_SESSION_ATTRIBUTE_NAME);
// if (user === undefined) return '';
// return user;
// }
// }

View File

@@ -1,34 +1,26 @@
import { Injectable } from "@angular/core";
import { Injectable } from '@angular/core';
import {
HttpClient,
HttpErrorResponse,
HttpHeaders,
} from "@angular/common/http";
import { Observable, throwError } from "rxjs";
import { catchError } from "rxjs/operators";
import { environment } from "src/environments/environment";
import { MeterData } from "../dataModels/Meterdata";
import { Meter } from "../dataModels/Meter";
import { LoginService } from "../auth/login.service";
} from '@angular/common/http';
import { Observable, throwError } from 'rxjs';
import { catchError } from 'rxjs/operators';
import { environment } from 'src/environments/environment';
import { MeterData } from '../dataModels/Meterdata';
import { Meter } from '../dataModels/Meter';
@Injectable({
providedIn: "root",
providedIn: 'root',
})
export class DatabaseService {
private baseUrl = environment.apiBaseUrl;
constructor(private http: HttpClient, private userService: LoginService) {}
constructor(private http: HttpClient) {}
getMeterData(): Observable<MeterData[]> {
const url = `${this.baseUrl}/meter-data`;
let jwtToken: String = this.userService.getUserSecurityToken(),
headers: HttpHeaders = new HttpHeaders({
authorization: "bearer " + jwtToken,
}),
options = { headers: headers };
return this.http
.get<MeterData[]>(url, options)
.pipe(catchError(this.handleError));
return this.http.get<MeterData[]>(url).pipe(catchError(this.handleError));
}
getMeterDataByType(usageType: string): Observable<MeterData[]> {
@@ -53,7 +45,7 @@ export class DatabaseService {
if (error.error instanceof ErrorEvent) {
// A client-side or network error occurred. Handle it accordingly.
console.error("An error occurred:", error.error.message);
console.error('An error occurred:', error.error.message);
} else {
// The backend returned an unsuccessful response code.
// The response body may contain clues as to what went wrong.