인터셉터

Coddy Node.js 여정의 TypeScript와 NestJS 섹션에 포함된 레슨. 17개 중 16번째.

각 핸들러를 일일이 수정하지 않고도 모든 응답에 처리 시간이 표시되도록 하고 싶습니다. 인터셉터는 핸들러를 감쌉니다. next.handle() 앞에 있는 코드는 핸들러 실행 전에 실행되고, next.handle()이 반환하는 값에 적용되는 코드는 핸들러 실행 후에 실행됩니다.

intercept(context: ExecutionContext, next: CallHandler) {
    console.log('before');
    return next.handle().pipe(
        tap(() => console.log('after')),
    );
}

next.handle()은 나중에 도착하는 값인 핸들러의 결과를 RxJS 옵저버블로 제공합니다. pipe(tap(...))은 그 값이 도착할 때 함수를 실행하며, 이는 Nest가 값을 보내기 전입니다. 파이프가 적용된 옵저버블을 반환하세요. Nest는 옵저버블이 전달하는 값을 보냅니다. context.switchToHttp().getResponse()는 res를 제공하며, 여기에 setHeader를 사용해 헤더를 추가할 수 있습니다.

app.useGlobalInterceptors(...)는 모든 경로에 인터셉터를 적용하고, @UseInterceptors(...)는 하나의 컨트롤러에 적용합니다.

챌린지

쉬움

ResponseTimeInterceptor를 완성하세요. 모든 응답에 핸들러가 걸린 시간(밀리초)이 X-Response-Time으로 포함되어야 합니다. 예: 3ms.
앱 전체에 등록하세요.
GET /tasks와 GET /stats를 보내고 Headers 탭을 여세요. 그런 다음 키 없이 POST /tasks를 보내세요.

직접 해보기

import { CallHandler, ExecutionContext, Injectable, NestInterceptor } from '@nestjs/common';
import { Observable, tap } from 'rxjs';

@Injectable()
export class ResponseTimeInterceptor implements NestInterceptor {
    intercept(context: ExecutionContext, next: CallHandler): Observable<unknown> {
        // 시간을 기록하고 핸들러를 실행한 다음 X-Response-Time을 설정합니다.
        return next.handle();
    }
}