Interceptor

Az interceptor lehetővé teszi egy adott művelet módosítását anélkül, hogy a műveletet végrehajtó eredeti kódhoz hozzá kellene nyúlni.

Ebben az összefüggésben az Angularban az interceptorokat gyakran használják a HTTP kérések és válaszok módosításához vagy kezeléséhoz. Az @angular/common/http modulon belül az HttpInterceptor interfészt használva hozhatunk létre saját interceptorokat.

Az interceptorok általában a következőképpen használhatók:

  1. Kérések módosítása: Például hitelesítési fejléc hozzáadása minden kéréshez.
  2. Válaszok kezelése: Például globális hibakezelés vagy válaszadatok transzformálása.
  3. Caching: Kérési válaszok tárolása és azok újbóli felhasználása.

Egy egyszerű interceptor példa, amely hozzáad egy “Authorization” fejlécet minden kéréshez:

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

@Injectable()
export class AuthInterceptor implements HttpInterceptor {
  intercept(req: HttpRequest<any>, next: HttpHandler) {
    const authReq = req.clone({
      headers: req.headers.set('Authorization', 'Bearer SOME_TOKEN')
    });

    return next.handle(authReq);
  }
}

Ezután az interceptorunkat be kell állítani az HTTP_INTERCEPTORS token alatt az app moduljában:

import { NgModule } from '@angular/core';
import { HTTP_INTERCEPTORS } from '@angular/common/http';
import { AuthInterceptor } from './auth.interceptor';

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

Az multi: true beállítás lehetővé teszi, hogy több interceptorunk is legyen, és egymás után futtassuk őket a kérések során.

Ez csak egy alapvető példa az interceptorok használatára az Angularban. A valós alkalmazásokban az interceptorok lehetnek sokkal összetettebbek és számos egyéb funkcióval is rendelkezhetnek.

Was this page helpful?