I am trying to implement HttpInterceptor. When I add it to @NgModule, I get the following error in Chrome:
Uncaught Error: Can't resolve all parameters for JwtInterceptor: (?, ?).     at syntaxError (compiler.js:466)     at CompileMetadataResolver._getDependenciesMetadata (compiler.js:15547)     at CompileMetadataResolver._getTypeMetadata (compiler.js:15382) Spent much time on googling, don’t have an idea what to undertake…
Here is how I provide the Interceptor in AppModule:
... providers: [    {       provide: HTTP_INTERCEPTORS,       useClass: JwtInterceptor,       multi: true    } ], ... Here is the Interceptor itself, nothing fancy:
export class JwtInterceptor implements HttpInterceptor {    constructor(private inj: Injector, private logger: Logger) {       this.logger.l(true)('Interceptor >>');    }     intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {       this.logger.l(true)('interceptor >>');        const auth = this.inj.get(AuthService);        // add token to the request:       const authReq = req.clone({          setHeaders: {             Authorization: `Bearer ${auth.getToken()}`          }       });        // return next.handle(authReq);       return next.handle(authReq).do((event: HttpEvent<any>) => {          if (event instanceof HttpResponse) {             // todo: get refreshed token if it exists:          }       }, (err: any) => {          if (err instanceof HttpErrorResponse) {             if (err.status === 401) {                auth.collectFailedRequest(authReq);                // todo: redirect to the login route or show a modal             }          }       });    } } HTTP Interceptors is a special type of angular service that we can implement. It's used to apply custom logic to the central point between the client-side and server-side outgoing/incoming HTTP request and response.
Angular applies interceptors in the order that you provide them. If you provide interceptors A, then B, then C, requests will flow in A->B->C, and responses will flow out C->B->A. In the example app, we have all the interceptors provided, but we only use one at a time. This is done by checking the path.
My bad, I forgot to add @Injectable() to my interceptor class.
add @Injectable() in your interceptor file after import statements
import { Injectable } from "@angular/core"; import { Observable, throwError } from "rxjs"; import { tap } from 'rxjs/operators'; import { Router } from '@angular/router'; import { ToastController } from '@ionic/angular';  @Injectable() <- add this in your interceptor file ...(maybe you have missed by mistake)  export class JwtInterceptor implements HttpInterceptor {   constructor(private router: Router,public toastController: ToastController) {    }   intercept(request: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {      return next.handle(request).pipe(       tap(         event =>  {           if (event instanceof HttpResponse) {             // do stuff with response if you want           }         }, If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With