I'm currently working on implementing a global error interceptor in my project. The idea is that whenever an error occurs, the user should be redirected to the main page with an error=true
query parameter. However, despite successfully catching and logging the error, the redirect does not seem to be working. Can anyone point out what I might be doing wrong?
HttpErrorInterceptor:
@Injectable()
export class HttpErrorInterceptor implements HttpInterceptor {
constructor(private router: Router) {
}
intercept(request: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
return next.handle(request)
.pipe(
catchError((error: HttpErrorResponse) => {
let errorMsg = '';
if (error.error instanceof ErrorEvent) {
errorMsg = `Error: ${error.error.message}`;
} else {
errorMsg = `Error Code: ${error.status}, Message: ${error.message}`;
}
const urlParams = new URLSearchParams(window.location.search);
this.router.navigate(['main'], {queryParams: {error: true, sesskey: urlParams.get('sesskey')}});
console.log(errorMsg);
return throwError(errorMsg);
})
)
}
}
app.module.ts:
providers: [
{
provide: HTTP_INTERCEPTORS,
useClass: HttpErrorInterceptor,
multi: true
},