import { HttpErrorResponse, HttpInterceptorFn } from '@angular/common/http';
import { inject } from '@angular/core';
import { AuthService } from '../services/auth-service';
import { catchError, switchMap, throwError } from 'rxjs';
export const authInterceptorInterceptor: HttpInterceptorFn = (req, next) => {
// const toaster=inject(ToastrService);
const authService=inject(AuthService);
const token=localStorage.getItem("access_token");
// token attach with request
if (token) {
const clonedRequest = req.clone({
setHeaders: {
Authorization: `Bearer ${token}`
}
});
return next(clonedRequest).pipe(
catchError((error: HttpErrorResponse) => {
let errorMessage = 'An unknown error occurred!';
if (error.status === 401) {
return authService.refreshToken().pipe(
switchMap((response: any) => {
console.log('Token refreshed successfully');
// Save new access token
localStorage.setItem(
'access_token',
response.accessToken
);
// Retry original request
const retryRequest = req.clone({
setHeaders: {
Authorization: `Bearer ${response.accessToken}`
}
});
return next(retryRequest);
}),
catchError((refreshError) => {
console.error(
'Refresh token failed:',
refreshError
);
// Both tokens are no longer valid
localStorage.removeItem('access_token');
localStorage.removeItem('refresh_token');
return throwError(() => refreshError);
})
);
}
if (error.error instanceof ErrorEvent) {
// Client-side or network error
errorMessage = `Error: ${error.error.message}`;
} else {
// Backend error
// Customize this based on your backend payload (e.g., error.error.message)
errorMessage = error.error?.message || error.message;
// Handle specific status codes globally here if needed (except 401)
if (error.status === 403) {
errorMessage = 'You do not have permission to access this resource.';
}
}
// Display the error via Toastr
console.log(error.message);
//toaster.error(errorMessage, Error ${error.status || ''});
return throwError(() => error);
})
);
}
return next(req);
};
Top comments (0)