Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to make an angular module to ignore http interceptor added in a core module

I do have a core module with an HttpInterceptor for authorization handling and I include this module in AppModule, in this way all the other modules that use HttpClient are using this interceptor.

@NgModule({   imports: [],   declarations: [],   providers: [     {       provide: HTTP_INTERCEPTORS,       useClass: AuthInterceptor,       multi: true,     },   ] }) export class CoreModule { } 

How to make a module bypass the default interceptor?

@NgModule({   imports: [     CommonModule   ],   declarations: components,   providers: [CustomService],   exports: components, }) export class ModuleWithoutInterceptorModule { } 
like image 990
Alexandru Olaru Avatar asked Sep 28 '17 12:09

Alexandru Olaru


People also ask

Can we bypass interceptor in angular?

Angular has a very powerful way of providing common logic to every http request made by your application. With HttpInterceptor you can add headers, log things, handle errors… Basically anything you may want to do with ALL http requests.

Can Angular have multiple HTTP interceptors?

So how can I add multiple interceptors? Http doesn't allow to have more than one custom implementation. But as @estus mentioned the Angular team has added a new HttpClient service recently (release 4.3) which supports multiple interceptors concept. You don't need to extend the HttpClient as you do with the old Http .

What is Http_interceptors in angular?

HTTP_INTERCEPTORSlinkA multi-provider token that represents the array of registered HttpInterceptor objects.


2 Answers

You can use HttpBackend.

Example:

import { HttpClient, ..., HttpBackend } from '@angular/common/http';  @Injectable() export class TestService {    private httpClient: HttpClient;    constructor( handler: HttpBackend) {       this.httpClient = new HttpClient(handler);   } .... 

In this way the service is not intercepted by AuthInterceptor.

like image 74
deg Avatar answered Sep 21 '22 21:09

deg


Per this suggestion on GitHub, we've implemented a simple header to identify requests that shouldn't be intercepted. In the interceptor:

export const InterceptorSkipHeader = 'X-Skip-Interceptor';  @Injectable() export class SkippableInterceptor implements HttpInterceptor {    intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {     if (req.headers.has(InterceptorSkipHeader)) {       const headers = req.headers.delete(InterceptorSkipHeader);       return next.handle(req.clone({ headers }));     }      ...  // intercept   }  } 

Then whenever you want to skip the interception for a particular request:

const headers = new HttpHeaders().set(InterceptorSkipHeader, '');  this.httpClient     .get<ResponseType>(someUrl, { headers })     ... 

Note that with this method the service, not the interceptor, is choosing when the interceptor's logic gets applied; this means that the services must "know" something about the interceptors in your application. Depending on your use case, it might be better to make the interceptors decide when to apply the logic.

like image 33
jonrsharpe Avatar answered Sep 23 '22 21:09

jonrsharpe