Angular2 Http Interceptor not working in child module Angular2 Http Interceptor not working in child module angular angular

Angular2 Http Interceptor not working in child module


Not the best answer - but check out this bug: https://github.com/angular/angular/issues/20575

Specifically the comment that reads:

You should import the HttpClientModule only once, see docs

I imagine that you are re-importing the HttpClientModule somewhere in your Module tree - likely in another child module. If you just declare it once, in the AppModule (or one if it's imports) then it should start working everywhere. That was my experience anyhow.

That kind of stinks - and feels ripe for causing bugs down the road when another dev imports it in a ChildModule later, and doesn't realize the intercept logic is no longer working. But that seems to be the way it is.


I came across with a similar problem. I got a custom HTTP interceptor for purpose of sending JWT to API and weirdly while some of my components working properly, some of them just rejected by server with 401. After some trial & errors, I read @MattW's answer and realized that there are multiple HttpClientModules imported in my application. I cleared them all and imported HttpClientModule only in the AppModule (root). After that, all is fixed.


I had the same issue. Interceptor was not adding a token requests made in lazy loaded modules. Importing HttpClientModule is not the best option, unless you want to override the HttpClientModule instance. If you import the HttpClientModule again, it will override all the interceptors declared in the root module.

Direct quote from angular docs:

To use the same instance of HttpInterceptors for the entire app, import the HttpClientModule only in your AppModule, and add the interceptors to the root application injector . If you import HttpClientModule multiple times across different modules (for example, in lazy loading modules), each import creates a new copy of the HttpClientModule, which overwrites the interceptors provided in the root module.

https://angular.io/api/common/http/HttpInterceptor#usage-notes