add refresh token

admin/src/app/app.ts

@@ -3,6 +3,7 @@ import { Router, RouterOutlet } from '@angular/router';
 import { MainMenu } from './components/main-menu/main-menu';
 import { AuthService } from './auth/auth.service';
 import { AdminLayout } from './layout/admin-layout/admin-layout';
+import { finalize } from 'rxjs/operators';
 
 @Component({
   selector: 'app-root',
@@ -16,8 +17,12 @@ export class App {
   constructor(private authService: AuthService, private router: Router) {}
 
   logout(): void {
-    this.authService.logout().subscribe(() => {
+    // Make a best-effort to log out on the server, but always
-      this.router.navigate(['/login']);
+    // clean up the client-side session in the `finalize` block.
-    });
+    this.authService.serverSideLogout().pipe(
+      finalize(() => {
+        this.authService.clientSideLogout();
+      })
+    ).subscribe();
   }
 }

admin/src/app/auth/auth.service.ts

@@ -2,6 +2,7 @@ import { Injectable } from '@angular/core';
 import { HttpClient } from '@angular/common/http';
 import { Observable, of } from 'rxjs';
 import { tap } from 'rxjs/operators';
+import { Router } from '@angular/router';
 
 @Injectable({
   providedIn: 'root',
@@ -11,7 +12,7 @@ export class AuthService {
   private readonly REFRESH_TOKEN_KEY = 'refreshToken';
   private apiUrl = 'http://localhost:4200/api/auth'; // Adjust if your server URL is different
 
-  constructor(private http: HttpClient) {}
+  constructor(private http: HttpClient, private router: Router) {}
 
   login(credentials: { username: string; password: string }): Observable<any> {
     return this.http.post<{ accessToken: string; refreshToken: string }>(`${this.apiUrl}/login`, credentials).pipe(
@@ -19,10 +20,20 @@ export class AuthService {
     );
   }
 
-  logout(): Observable<any> {
+  /**
-    return this.http.post(`${this.apiUrl}/logout`, {}).pipe(
+   * Makes a best-effort call to the server to invalidate the refresh token.
-      tap(() => this.removeTokens())
+   */
-    );
+  serverSideLogout(): Observable<any> {
+    return this.http.post(`${this.apiUrl}/logout`, {});
+  }
+
+  /**
+   * Performs the client-side cleanup, removing tokens and redirecting to login.
+   * This is the definitive logout action from the user's perspective.
+   */
+  clientSideLogout(): void {
+    this.removeTokens();
+    this.router.navigate(['/login']);
   }
 
   refreshToken(): Observable<any> {

admin/src/app/auth/jwt.interceptor.ts

@@ -9,14 +9,13 @@ import {
 import { Observable, throwError, BehaviorSubject } from 'rxjs';
 import { catchError, switchMap, filter, take } from 'rxjs/operators';
 import { AuthService } from './auth.service';
-import { Router } from '@angular/router';
 
 @Injectable()
 export class JwtInterceptor implements HttpInterceptor {
   private isRefreshing = false;
   private refreshTokenSubject: BehaviorSubject<any> = new BehaviorSubject<any>(null);
 
-  constructor(private authService: AuthService, private router: Router) {}
+  constructor(private authService: AuthService) {}
 
   intercept(
     request: HttpRequest<any>,
@@ -42,9 +41,6 @@ export class JwtInterceptor implements HttpInterceptor {
   private handle401Error(request: HttpRequest<any>, next: HttpHandler) {
     if (!this.isRefreshing) {
       this.isRefreshing = true;
-
-      // The subject is now single-use. Re-create it for each refresh cycle.
-      // The initial `null` value is what makes followers wait.
       this.refreshTokenSubject = new BehaviorSubject<any>(null);
 
       return this.authService.refreshToken().pipe(
@@ -55,16 +51,12 @@ export class JwtInterceptor implements HttpInterceptor {
         }),
         catchError((err) => {
           this.isRefreshing = false;
-
-          // Propagate the error to all waiting followers and kill the subject.
           this.refreshTokenSubject.error(err);
 
-          // Perform the logout and redirect
+          // In a refresh failure, the user MUST be logged out.
-          this.authService.logout().subscribe(() => {
+          // Call the synchronous client-side logout to avoid re-intercepting.
-            this.router.navigate(['/login']);
+          this.authService.clientSideLogout();
-          });
 
-          // Also ensure the original caller gets the error
           return throwError(() => err);
         })
       );

server/api.http

@@ -1,4 +1,4 @@
-POST http://localhost:3000/auth/login
+POST {{apiBaseUrl}}/auth/login
 Content-Type: application/json
 
 {
@@ -6,10 +6,10 @@ Content-Type: application/json
   "password": "123456"
 }
 
-> {% client.global.set("auth_token", response.body.access_token); %}
+> {% client.global.set("auth_token", response.body.accessToken); %}
 
 
 ### GET request with parameter
-GET http://localhost:3000/users
+GET {{apiBaseUrl}}/users
 Accept: application/json
 Authorization: Bearer {{auth_token}}

server/http-client.env.json

@@ -0,0 +1,5 @@
+{
+  "dev": {
+    "apiBaseUrl": "http://localhost:3000/api"
+  }
+}