Création d'un intercepteur HTTP dans Angular avec le décorateur @Injectable

Pour créer un nouvel intercepteur HTTP dans Angular, le décorateur que vous utilisez est @Injectable. Ce décorateur, qui indique que la classe qui le suit peut être utilisée avec un injecteur, est essentiel pour les intercepteurs HTTP dans Angular.

Quand vous appliquez @Injectable à une classe, cela signifie que cette classe peut être utilisée comme un service injectable. En d'autres termes, Angular peut utiliser cette classe pour créer des instances, et ces instances peuvent être injectées dans d'autres classes comme dépendances.

Voici un exemple simple de comment on peut utiliser le décorateur @Injectable pour créer un intercepteur HTTP :

import { Injectable } from '@angular/core';
import { HttpEvent, HttpInterceptor, HttpHandler, HttpRequest } from '@angular/common/http';
import { Observable } from 'rxjs';

@Injectable()
export class ExampleHttpInterceptor implements HttpInterceptor {
  intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
    // Logique d'interception ici
  }
}

Dans cet exemple, nous avons une classe ExampleHttpInterceptor qui utilise @Injectable. Cela rend la classe utilisable par Angular comme un service qui peut intercepter les requêtes HTTP entrantes.

Notez que pour qu'un intercepteur HTTP soit effectivement utilisé, vous devez l'ajouter à la pile d'intercepteurs de l'application Angular. Cela se fait généralement dans le module racine de l'application, en utilisant la méthode provide de l'objet HTTP_INTERCEPTORS :

import { HttpClientModule, HTTP_INTERCEPTORS } from '@angular/common/http';
import { ExampleHttpInterceptor } from './example-http-interceptor';

@NgModule({
  imports: [HttpClientModule],
  providers: [
    { provide: HTTP_INTERCEPTORS, useClass: ExampleHttpInterceptor, multi: true },
  ],
})
export class AppModule { }

Assurez-vous de toujours utiliser le décorateur @Injectable lorsque vous créez votre propre intercepteur HTTP dans Angular. C'est une bonne pratique qui permet à Angular de gérer efficacement le cycle de vie de vos classes et leurs dépendances.