diff --git a/frontend/src/app/app.component.html b/frontend/src/app/app.component.html
index fe855b6..687f395 100644
--- a/frontend/src/app/app.component.html
+++ b/frontend/src/app/app.component.html
@@ -5,7 +5,7 @@
My Blog
diff --git a/frontend/src/app/app.component.ts b/frontend/src/app/app.component.ts
index 2ecc95b..14ecff1 100644
--- a/frontend/src/app/app.component.ts
+++ b/frontend/src/app/app.component.ts
@@ -27,6 +27,6 @@ export class AppComponent {
this.loginOpen = !this.loginOpen;
}
logOut() {
- this.auth.jwt.set(null);
+ this.auth.logout();
}
}
diff --git a/frontend/src/app/shared/services/auth.service.ts b/frontend/src/app/shared/services/auth.service.ts
index c6a0e12..a1f7a82 100644
--- a/frontend/src/app/shared/services/auth.service.ts
+++ b/frontend/src/app/shared/services/auth.service.ts
@@ -6,7 +6,7 @@ import {
signal,
WritableSignal,
} from '@angular/core';
-import { LoginResponse, User, Token } from '../interfaces/auth';
+import { LoginResponse, User, Claims } from '../interfaces/auth';
import { environment } from '../../../environments/environment';
const JWT_KEY = 'token';
@@ -17,6 +17,7 @@ const JWT_KEY = 'token';
export class AuthService {
private http = inject(HttpClient);
jwt: WritableSignal = signal(null);
+ claims: WritableSignal = signal(null);
timeout: any | null = null;
constructor() {
@@ -26,6 +27,16 @@ export class AuthService {
this.jwt.set(token);
}
+ // update claims
+ effect(() => {
+ const token = this.jwt();
+ if (!token) {
+ this.claims.set(null);
+ return;
+ }
+ this.claims.set(parseJwt(token));
+ });
+
// set localStorage when this.jwt changes
effect(() => {
const token = this.jwt();
@@ -65,6 +76,11 @@ export class AuthService {
.post(`${environment.apiRoot}/login`, user)
.subscribe((res) => this.jwt.set(res.token));
}
+ logout() {
+ this.http.delete(`${environment.apiRoot}/logout`).subscribe(() => {
+ this.jwt.set(null);
+ });
+ }
private clearTimeout() {
if (this.timeout) {
@@ -75,7 +91,7 @@ export class AuthService {
}
// https://stackoverflow.com/questions/38552003/how-to-decode-jwt-token-in-javascript-without-using-a-library
-function parseJwt(token: string): Token {
+function parseJwt(token: string): Claims {
var base64Url = token.split('.')[1];
var base64 = base64Url.replace(/-/g, '+').replace(/_/g, '/');
var jsonPayload = decodeURIComponent(