[NestJS] Pipe를 이용한 유효성 검사

예를 들어 게시물을 하나 만들 때 조건을 주고 싶다. 제목이 없으면 안 되고 내용이 없으면 안 되고 제목은 무조건 한글이어야 되고... 등등 이런 것을 사전에 확인해주는 것이 파이프다.

 

Pipe란?

파이프를 data의 transformation과 validation을 위해 사용된다. 컨트롤러 경우 처리기에 의해 처리된다.

@Injectalble() 데코레이터로 주석이 달린 클래스이며 Nest는 메서드가 호출되기 직전에 파이프를 삽입하고 파이프는 메서드로 들어가는 인수를 수신해 동작한다.

파이프는 두 가지의 유즈 케이스를 가지고 있다.

Data Transformation : 입력 데이터를 원하는 형식으로 변환

Data Validation : 입력 데이터를 평가하고 유효산 경우 변경되지 않은 상태로 전달하면 됨. 그렇지 않으면 데이터가 올바르지 않을 때 예외를 발생시킴.

 

이러한 두 경우는 Route Handler가 처리하는 인수에 대해 작동한다. 그리고 이는 메서드 실행 직전에 작동해 변환이 필요하면 변환을 실행하고 유효성 체크가 필요하다면 이도 진행된다.

 

Pipe의 사용법 세 가지

Handler-level pipes, Parameter-level pipes, Global-level pipes

 

Handler-level pipes

핸들러 레벨에서 "@UsePipes()" 데코레이터를 이용해서 사용할 수 있다. 이는 모든 파라미터에 적용된다.

@Post()
@UsePipes(pipe)
createBoard(
	@Body('title') title,
    	@Body('description') description
){
	~~~
}

 

Parameter-level pipes

특정 파라미터에게만 적용이 되는 파이프라인이다.

아래 예시와 같이 사용한다면 'title' 파라미터만 파이프가 적용이 된다.

@Post()
createBoard(
	@Body('title', ParameterPipe) title,
    	@Body('description') description
){
	~~~
}

 

Global-level pipes

이는 글로벌 파이프로서 애플리케이션 레벨의 파이프다.

클라이언트로부터 들어온 모든 요청에 적용되면 가장 첫 관문인 'main.ts'에 넣어주면 된다.

async function bootstrap() {
  const app = await NestFactory.create(AppModule);
  app.useGlobalPipes(GlobalPipes);
  await app.listen(3000);
}
bootstrap();

 

 

Built-in Pipes

Nest JS에는 기본적으로 사용할 수 있게 만들어 놓은 6가지의 파이프가 있다.

- ValidationPipe
- ParseIntPipe
- ParseBoolPipe
- ParseArrayPipe
- ParseUUIDPipe
- DefaultValuePipe

 

나는 여기서 ValidationPipe를 실습해보겠다.

 

실습

ValidationPipe를 이용해 클라이언트로부터 들어오는 요청이 헨들러 메서드로 들어가기 전 유효성 검사를 진행할 수 있다.

 

모듈 설치가 필요하다. 나는 'yarn'을 이용해 추가해주었다. 만약 'npm'을 사용한다면 'npm install -'을 해서도 사용이 가능하다.

 

필요 모듈

class-validator, class-transformer

$ yarn add class-validator class-transformer

Documentaion - 📎 https://github.com/typestack/class-validator#manual-validation

GitHub - typestack/class-validator: Decorator-based property validation for classes.

 

파이프 생성

지금은 게시물을 생성할 때 제약을 주지 않아 'title'과 'description'의 내용이 아무것도 없어도 게시가 가능했다. 이 부분을 'dto'폴더의 수정을 통해 파이프를 수정해보겠다.

// create-board.dto.ts

import { IsNotEmpty } from 'class-validator';

export class CreateBoardDto {
  @IsNotEmpty()
  title: string;

  @IsNotEmpty()
  description: string;
}

// boards.controller.ts

 @Post('/')
  @UsePipes(ValidationPipe)
  createBoard(@Body() createBoardDto: CreateBoardDto): Board {
    return this.boardsService.createBoard(createBoardDto);
  }

Handler-level pipes로 설정해주었다.

내용을 비우고 요청을 보내면 아래와 같은 결과를 얻을 수 있다.