Intercept HTTP Requests in Angular

Denis Cangemi
5 min readApr 18, 2018
Wikipedia

Handling HTTP requests in Angular it’s very easy and well done.
For starting a conversation with an API point or a server, you only need a few lines of code like these:

import { HttpClient } from ‘@angular/common/http’;

constructor(private httpClient: HttpClient) {

this.httpClient.get(“your_api_url")
.subscribe(
success => {
console.log(“Successfully Completed”);
console.log(success);
}
);
}

You can handle requests anywhere you want, in a component, or better in a dedicated service.

When you make HTTP requests maybe you need more for the connection.
The HTTP protocol has a lot of things you can personalize, like headers, options, and much more.
If you are here and you have some basic Angular knowledge, you know why HTTP interceptors are very useful.

If you are not familiar with those concepts, don’t worry, you only need to know that Angular has a method which let you doing whatever you want before your http request will sent to the server.

Now you are thinking :

well, I don’t really need an interceptor to do that, I can make any type of operation I want before making the request

--

--

Denis Cangemi

IT Project Manager | Writing about Coding and Project Management | ISIPM-Base® / PSM™ I / SFC™