Commit 5eb663fb by Nakarin Luankla

UPDATE แก้ http-request.interceptor.ts

parent 89253046
...@@ -78,7 +78,7 @@ ...@@ -78,7 +78,7 @@
role="alert"> role="alert">
กรุณาตรวจสอบชื่อสมาชิกและรหัสผ่าน กรุณาตรวจสอบชื่อสมาชิกและรหัสผ่าน
</div> </div>
<button type="submit" (click)="Submit()" <button type="submit"
class="py-2 px-3 inline-flex justify-center items-center gap-2 rounded-sm border border-transparent font-semibold bg-primary text-white hover:bg-primary focus:outline-none focus:ring-0 focus:ring-primary focus:ring-offset-0 transition-all text-sm dark:focus:ring-offset-white/10">เข้าสู่ระบบ</button> class="py-2 px-3 inline-flex justify-center items-center gap-2 rounded-sm border border-transparent font-semibold bg-primary text-white hover:bg-primary focus:outline-none focus:ring-0 focus:ring-primary focus:ring-offset-0 transition-all text-sm dark:focus:ring-offset-white/10">เข้าสู่ระบบ</button>
<!-- <div class="text-center"> <!-- <div class="text-center">
<p class="mt-3 text-sm text-gray-600 dark:text-white/70"> <p class="mt-3 text-sm text-gray-600 dark:text-white/70">
......
...@@ -3,6 +3,7 @@ import { Injectable } from '@angular/core'; ...@@ -3,6 +3,7 @@ import { Injectable } from '@angular/core';
import { AngularFireAuth } from '@angular/fire/compat/auth'; import { AngularFireAuth } from '@angular/fire/compat/auth';
import { Router } from '@angular/router'; import { Router } from '@angular/router';
import { BehaviorSubject, catchError, filter, Observable, switchMap, tap, throwError } from 'rxjs'; import { BehaviorSubject, catchError, filter, Observable, switchMap, tap, throwError } from 'rxjs';
import { TokenService } from './token.service';
@Injectable({ @Injectable({
providedIn: 'root', providedIn: 'root',
...@@ -11,13 +12,18 @@ export class AuthService { ...@@ -11,13 +12,18 @@ export class AuthService {
authState: any; authState: any;
apiBaseUrl = "/auth"; apiBaseUrl = "/auth";
constructor(private router: Router, private http: HttpClient) { constructor(private router: Router, private http: HttpClient, private tokenService: TokenService) {
} }
refreshToken(token: string) { refreshToken(token: string) {
return this.http.post<any>(this.apiBaseUrl + "/refresh-token", { return this.http.post<any>(this.apiBaseUrl + "/refresh-token", {
"refreshToken": token "refreshToken": token
}); }).pipe(
tap(response => {
this.tokenService.saveToken(response.accessToken);
this.tokenService.saveRefreshToken(response.refreshToken);
})
);
} }
get isUserAnonymousLoggedIn(): boolean { get isUserAnonymousLoggedIn(): boolean {
......
...@@ -14,7 +14,7 @@ import { TokenService } from './token.service'; ...@@ -14,7 +14,7 @@ import { TokenService } from './token.service';
const TOKEN_HEADER_KEY = 'Authorization'; const TOKEN_HEADER_KEY = 'Authorization';
@Injectable() @Injectable()
export class HttpRequestInterceptor { export class HttpRequestInterceptor {
private isRefreshing = false; private isRefreshing = true;
private refreshTokenSubject: BehaviorSubject<any> = new BehaviorSubject<any>(null); private refreshTokenSubject: BehaviorSubject<any> = new BehaviorSubject<any>(null);
constructor(private tokenService: TokenService, private authService: AuthService) { } constructor(private tokenService: TokenService, private authService: AuthService) { }
...@@ -36,29 +36,30 @@ export class HttpRequestInterceptor { ...@@ -36,29 +36,30 @@ export class HttpRequestInterceptor {
return next.handle(authReq).pipe(catchError(error => { return next.handle(authReq).pipe(catchError(error => {
if (fullUrl.includes("login")) { if (fullUrl.includes("login")) {
return next.handle(this.addTokenHeader(req, "Bearer ", fullUrl)) return next.handle(this.addTokenHeader(req, "Bearer ", fullUrl))
} else if (error instanceof HttpErrorResponse && (error.status === 401 || error.status === 403) && !fullUrl.includes("login")) { } else if (error instanceof HttpErrorResponse && error.status === 401 && !fullUrl.includes("login")) {
return this.handle403Error(authReq, next, fullUrl); if(fullUrl.includes("/refresh-token")&& error.status === 401){
this.tokenService.signOut();
}else{
this.isRefreshing = false;
return this.handle401Error(authReq, next, fullUrl);
}
} }
return throwError(error); return throwError(error);
})); }));
} }
} }
private handle403Error(request: HttpRequest<any>, next: HttpHandler, fullUrl: string) { private handle401Error(request: HttpRequest<any>, next: HttpHandler, fullUrl: string) {
if (!this.isRefreshing) { if (!this.isRefreshing) {
this.isRefreshing = true;
this.refreshTokenSubject.next(null); this.refreshTokenSubject.next(null);
const token = this.tokenService.getRefreshToken(); const token = this.tokenService.getRefreshToken();
if (token) { if (token) {
return this.authService.refreshToken(token.replace("Bearer ", "")).pipe( return this.authService.refreshToken(token.replace("Bearer ", "")).pipe(
switchMap((token: any) => { switchMap((token: any) => {
this.isRefreshing = false; this.isRefreshing = true;
this.tokenService.saveToken(token.accessToken); console.log("🚀 2222222222222222222222222222222222222", this.isRefreshing)
this.tokenService.saveRefreshToken(token.refreshToken);
this.refreshTokenSubject.next(token.accessToken); this.refreshTokenSubject.next(token.accessToken);
return next.handle(this.addTokenHeader(request, "Bearer " + token.accessToken, fullUrl)); return next.handle(this.addTokenHeader(request, "Bearer " + token.accessToken, fullUrl));
}), }),
catchError((err) => { catchError((err) => {
......
...@@ -51,7 +51,7 @@ export class TokenService { ...@@ -51,7 +51,7 @@ export class TokenService {
window.localStorage.clear(); window.localStorage.clear();
localStorage.clear(); localStorage.clear();
sessionStorage.clear() sessionStorage.clear()
this.router.navigate(["/auth/splash"]); this.router.navigate(['/auth/login']);
} }
public saveToken(token: string): void { public saveToken(token: string): void {
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment