<aside> 💡 Data de publicação: 23/09/2020

</aside>

Um pouco de história

Angular é um framework e uma plataforma para o desenvolvimento web, focado na modularização do código utilizando módulos ou ngModules para isso.

Quando estamos desenvolvendo uma aplicação Angular sempre pensamos na melhor forma para construir componentes, módulos, serviços etc.

Seguindo nessa linha contarei algo que foi necessário desenvolver durante um projeto, eu e o meu time estavámos sem back-end no momento e precisávamos seguir no desenvolvimento dos serviços para podermos concluir algumas tasks.

Começamos com um server json para simularmos as requisições, mas acabou se tornando insustentável esse método por questões do projeto e arquitetura, assim com Interceptors podiámos criar o serviços de forma que fosse simples atualizar os mesmos quando fosse necessário, assim melhorando a modularidade da aplicação.

O que são os HttpInterceptors?

Básicamente falando são interceptadores de requisições Http, eles servem para configurar e enviar requisições para o servidor.

Assim podemos fazer um milhão de coisas, um exemplo seria uma autenticação via token em qualquer requisição, ou até tratar respostas antes de terminar a requisição.

Partiu desenvolver :)

Para que você consiga realizar todos os passos mostrados aqui você precisará do Node instalado, caso você não tenha aqui têm um bom tutorial de instalação:

Tutorial instalação node para Ubuntu

Seguindo vamos precisar do CLI do Angular, para instalar o mesmo é bem simples:

npm install -g @angular/cli

Depois disso podemos criar o nosso projeto Angular dessa forma:

ng new InterceptorExample

Após criar o nosso projeto podemos começar criando o interceptor que estaremos utilizando:

ng generate interceptors interceptor-name [--options]

Você terá um estrutura parecida com essa:

@Injectable()
export class BackendInterceptor implements HttpInterceptor {
	intercept(
		request: HttpRequest<any>,
		next: HttpHandler
	): Observable<HttpEvent<any>> {
		// Seu código aqui
	}
}