Httpinterceptor and loading service is not compatible

This repository’s issues are reserved for feature requests and bug reports.

Do you want to request a feature or report a bug?

Feature request

Feature Request

HttpInterceptor and LoadingService should be compatible in my case, i want to register a loading service on OnRequest (httpinterceptor) and resolve the request on OnResponse (httpinterceptor) but i cant register the loading, but when i register the loading service in the component its work like a charm

`

@Injectable()
export class HttpInterceptor implements IHttpInterceptor {

  constructor(private _loadingService: TdLoadingService) {}

onRequest(requestOptions) {
  this._loadingService.register('customer-tree')
  return requestOptions;
}

onRequestError(requestOptions) {
  return requestOptions;
}

onResponse(response) {
  return response;
}

onResponseError(error) {
  return error;
}
}`

What is the expected behavior?

we should can register the loading service in the httpinterceptor method

[eddiejaoude]

@marcoleon94 I have done something similar, if this might help…

@Injectable()
export class ErrorHttpInterceptor implements HttpInterceptor {

  constructor(private router: Router, private snackBar: MatSnackBar) {
  }

  intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
    return next.handle(req).do(undefined, (error: any) => {
      if (error instanceof HttpErrorResponse) {
        switch (error.status) {
          case 401:
          case 403:
          case 404:
            this.router.navigate(['/'])
              .then(() => this.snackBar.open('An ERROR occured please try again', undefined, { duration: 5000 }));
            break;
          default:
            this.snackBar.open(error.message, undefined, { duration: 5000 });
            break;
        }
      }
    });
  }
}

providers: [
    {
      provide: HTTP_INTERCEPTORS,
      useClass: ApiHttpInterceptor,
      multi: true,
    },
    {
      provide: HTTP_INTERCEPTORS,
      useClass: ErrorHttpInterceptor,
      multi: true,
    },
    AuthGuard,
// ...

[marcoleon94]

Hi, I’ve tried to replicate almost the same behavior of this issue, I have a custom interceptor that implements the IHttpInterceptor class and it works propely on its own, but when i want to add an Authentication service on the interceptor, I get an error. My question is, am I doing something wrong when trying to add the authorization service on the interceptor, or is it a bug? I’ve checked that angular 5 had a similar issue but it was solved on version 5.2.3 wich im runinng at the moment.

I’m attaching the code example:

@Injectable()
export class ApiInterceptor implements IHttpInterceptor {

  constructor(private authSercive:AuthService){

  }
//....
onResponseError(error: Response): Response {
    // ... // check error status and do something
    console.log("On response error", error);
    this.authSercive.logout()
    return error;
  }

and the injection on my app

const httpInterceptorProviders: Type<IHttpInterceptor>[] = [
  ApiInterceptor
]

@NgModule({
  declarations: [
    AppComponent,
    WelcomeComponent,
    
  ],
  imports: [
    BrowserModule,
    BrowserAnimationsModule,
    HttpModule,
    CovalentHttpModule.forRoot({
      interceptors: [
        {
          interceptor: ApiInterceptor, paths: ['**'],
        }
      ]
    }),
    SharedModule,
    AppRoutingModule

  ],
  providers: [
    UserGuard,
    httpInterceptorProviders,
    AuthService,
    
    CustomRESTService,
    LoadingService
  ],
  bootstrap: [AppComponent]
})
export class AppModule { } 

for which i get the next error

ERROR RangeError: Maximum call stack size exceeded
    at eval (covalent-http.js:26)
    at Array.forEach (<anonymous>)
    at new HttpInterceptorService (covalent-http.js:26)
    at httpFactory (covalent-http.js:252)
    at _callFactory (core.js:10903)
    at _createProviderInstance$1 (core.js:10851)
    at resolveNgModuleDep (core.js:10833)
    at _createClass (core.js:10878)
    at _createProviderInstance$1 (core.js:10848)
    at resolveNgModuleDep (core.js:10833)

I’m also adding the reference from someone’s question related to what i’m trying to do https://stackoverflow.com/questions/45213352/httpinterceptor-service-httpclient-cyclic-dependency