From 97c7c565875bec9923169ff4b3dd55394c716fef Mon Sep 17 00:00:00 2001 From: Max Ehrlicher-Schmidt Date: Tue, 17 Nov 2020 12:18:53 +0100 Subject: [PATCH 1/2] Fix interceptor --- src/app/graphql.module.ts | 14 +-------- src/app/helper/token.interceptor.ts | 11 +++---- src/app/services/auth.service.ts | 48 ++++++++++++++++++----------- 3 files changed, 36 insertions(+), 37 deletions(-) diff --git a/src/app/graphql.module.ts b/src/app/graphql.module.ts index fd2d0f5..9b7ae36 100644 --- a/src/app/graphql.module.ts +++ b/src/app/graphql.module.ts @@ -13,18 +13,6 @@ import { DefaultOptions } from '@apollo/client/core/ApolloClient'; const uri = environment.apiUrl + '/graphql'; // <-- add the URL of the GraphQL server here -const authMiddleware = new ApolloLink((operation, forward) => { - //Add token here TODO: use AuthService to get the Token - operation.setContext({ - headers: { - authorization: localStorage.getItem('requestToken') || null, - } - }); - return forward(operation).map((data) => { - return data; - }); -}); - const defaultOptions: DefaultOptions = { watchQuery: { fetchPolicy: 'no-cache', @@ -38,7 +26,7 @@ const defaultOptions: DefaultOptions = { export function createApollo(httpLink: HttpLink): ApolloClientOptions { return { - link: concat(authMiddleware, httpLink.create({ uri })), + link: httpLink.create({ uri }), cache: new InMemoryCache({}), defaultOptions: defaultOptions, }; diff --git a/src/app/helper/token.interceptor.ts b/src/app/helper/token.interceptor.ts index 693ca02..f6bbe2e 100644 --- a/src/app/helper/token.interceptor.ts +++ b/src/app/helper/token.interceptor.ts @@ -8,7 +8,7 @@ import { catchError, filter, take, switchMap } from 'rxjs/operators'; export class TokenInterceptor implements HttpInterceptor { private isRefreshing = false; - private refreshTokenSubject: BehaviorSubject = new BehaviorSubject(null); + private requestTokenSubject: BehaviorSubject = new BehaviorSubject(null); constructor(public authService: AuthService) { } @@ -20,7 +20,6 @@ export class TokenInterceptor implements HttpInterceptor { return next.handle(request).pipe(catchError(error => { if (error instanceof HttpErrorResponse && error.status === 401) { - console.log("catching error"); return this.handle401Error(request, next); } else { return throwError(error); @@ -39,17 +38,17 @@ export class TokenInterceptor implements HttpInterceptor { private handle401Error(request: HttpRequest, next: HttpHandler) { if (!this.isRefreshing) { this.isRefreshing = true; - this.refreshTokenSubject.next(null); + this.requestTokenSubject.next(null); return this.authService.refreshToken().pipe( switchMap((token: any) => { this.isRefreshing = false; - this.refreshTokenSubject.next(token.jwt); - return next.handle(this.addToken(request, token.jwt)); + this.requestTokenSubject.next(token.request_token); + return next.handle(this.addToken(request, token.request_token)); })); } else { - return this.refreshTokenSubject.pipe( + return this.requestTokenSubject.pipe( filter(token => token != null), take(1), switchMap(jwt => { diff --git a/src/app/services/auth.service.ts b/src/app/services/auth.service.ts index 292de6b..6878b02 100644 --- a/src/app/services/auth.service.ts +++ b/src/app/services/auth.service.ts @@ -1,8 +1,8 @@ import { Injectable } from '@angular/core'; import { HttpClient } from '@angular/common/http'; -import { finalize, map, tap } from 'rxjs/operators'; +import { catchError, finalize, map, tap } from 'rxjs/operators'; import { environment } from '../../environments/environment'; -import { BehaviorSubject } from 'rxjs'; +import { BehaviorSubject, of } from 'rxjs'; @Injectable({ providedIn: 'root', @@ -44,23 +44,37 @@ export class AuthService { logout() { // remove token from local storage to log user out return this.http - .post(`${environment.authUrl}/logout`, { request_token: this.getRequestToken() }).pipe(finalize(() => { - this.removeTokens(); - this.checkIfUserIsLoggedIn(); - } - )); + .post(`${environment.authUrl}/logout`, { + request_token: this.getRequestToken(), + }) + .pipe( + finalize(() => { + this.removeTokens(); + this.checkIfUserIsLoggedIn(); + }) + ); } refreshToken() { - return this.http.post(`${environment.authUrl}/new-token`, { - 'refresh_token': this.getRefreshToken() - }).pipe(tap((tokens: any) => { - this.storeTokens(tokens); - })); - } - - private storeRequestToken(jwt: string) { - localStorage.setItem(this.REQUEST_TOKEN, jwt); + return this.http + .post(`${environment.authUrl}/new-token`, { + refresh_token: this.getRefreshToken(), + }) + .pipe( + tap((tokens: any) => { + this.storeTokens(tokens); + }) + ) + .pipe( + catchError((error: any) => { + if (error.status === 400) { + this.removeTokens(); + this.checkIfUserIsLoggedIn(); + location.replace('/login'); + } + return of(); + }) + ); } private storeTokens(tokens: any) { @@ -72,6 +86,4 @@ export class AuthService { localStorage.removeItem(this.REQUEST_TOKEN); localStorage.removeItem(this.REFRESH_TOKEN); } - - } From 8ccb75697c896d3dfbc9e7dcd9a184629157fca8 Mon Sep 17 00:00:00 2001 From: Max Ehrlicher-Schmidt Date: Tue, 17 Nov 2020 16:41:23 +0100 Subject: [PATCH 2/2] Improve Performance --- .../pages/tables/bikes/bikes.component.html | 18 +++++++++++++----- 1 file changed, 13 insertions(+), 5 deletions(-) diff --git a/src/app/pages/tables/bikes/bikes.component.html b/src/app/pages/tables/bikes/bikes.component.html index cf30a16..eac2a82 100644 --- a/src/app/pages/tables/bikes/bikes.component.html +++ b/src/app/pages/tables/bikes/bikes.component.html @@ -9,10 +9,17 @@ matTooltip="Tabllendaten aktualisieren. Achtung! Alle ungespeicherten Änderungen gehen verloren." (click)="reloadTable()" [disabled]="reloadingTable" - i18n > sync + Filter @@ -60,6 +67,7 @@ + @@ -85,7 +93,7 @@ -
+