[TypeScript] class-validator 사용하기

class-validator란?

typescirpt를 사용할 때 decorator를 이용하여 편하게 검증할 수 있는 라이브러리이다.

유효성 검사를 하거나 데이터가 제대로 온 것인지 검증해야 할 때 유용하게 사용할 수 있다.

검증하고 싶은 파라미터 위에 데코레이터를 사용하면 검증할 수 있다.

 

• 타입스크립트 데코레이터(decorator)의 개념 상에 빌드되며 새로운 작업 방식을 제공
• 클래스 내 데코레이터의 도움을 받아 검증(validation) 규칙(rule)을 추가하게 해준다
• 클래스를 인스턴스화할 때마다 실제로 우리가 설정한 규칙에 따라 검증할 수 있다
• 특정 속성들(properties)을 검증하고자 하는 모델 및 클래스에 추가해야 한다
• class-valiator로부터 검증 방식(validate method)를 import 해야 제대로 작동된다
• 큰 규모의 프로젝트를 타입스크립트로 빌드하는 경우 알아야 하는 아주 강력한 패키지이다

 

공식 깃허브: https://github.com/typestack/class-validator

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

 

 

 

 

 

 

 

 

설치하기

$ npm install class-validator --save

$ yarn add class-validator

 

 

 

 

 

 

 

 

사용 예제

// product.model.ts
import { IsNotEmpty, IsNumber, IsPositive } from 'class-validator';

export class Product {
	@IsNotEmpty()  // 빈 문자열(string) 불가
	title: string;

	@IsNumber()
	@IsPositive()  // 양수가 되어야 한다
	price: number;

	constructor(t: string, p: number) {
		this.title = t;
		this.price = p;
	}

	getInformation() {
		return [this.title, `${this.price}`];
	}
}

검증하고 싶은 파라미터 위에 데코레이터를 사용하면 된다.

 

 

// tsconfig.json
// decorator 사용을 위해 experimental decorators 활성화

"experimentalDecorators": true,

decorator를 사용하려면 tsconfig.json 파일도 수정이 필요한데, 위의 코드가 주석처리 되었다면 다시 주석을 지워야 한다.

 

 

// app.ts
import { validate } from 'class-validator';

import { Product } from './product.model';

const newProd = new Product('', -5.99);  /// => error message 보내준다
// 검증 error를 return할 것이다
validate(newProd).then(errors => {
	if (errors.length > 0) {
		console.log('VALIDATION ERRORS!');
		console.log(errors); 
	}
	else {
		console.log(newProd.getInformation());
	}
});

 

 

 

 

 

 

자주 사용하는 데코레이터

 

@IsString() 문자열인지 검증

@IsInt() Int값인지에 대한 검증

@IsBoolean() Boolean값인지에 대한 검증

@IsEmail() 이메일 형식인지에 대한 검증

@IsArray() 배열 값인지에 대한 검증

@IsEnum() Enum값인지에 대한 검증

@IsNumber() 숫자값인지에 대한 검증(소숫점도 검증 가능)

@IsDate() 날짜값인지에 대한 검증

@IsBase64() Base64 값인지에 대한 검증(토큰 처리를 Base64로 했을시 사용)

@IsOptional() 값이 들어오지 않으면 검증을 안해도 된다는 데코레이터

@MaxLength() 최대 길이 제한

@MinLength() 최소 길이 제한

@Length() 길이 제한

@Matches(RegExp(''), {message : ""}) 정규표현식 입력 값을 검증할 떄 사용 

@Min() 최솟값

@Max() 최댓값

이외에도 많지만 자주 사용하는 것만 정리했다.

전체 decorator와 option들은 공식 깃허브를 통해 알 수 있다.

 

 

 

 

 

 

 

 

 

---

좀 더 찾아보니까 next js 를 사용할 때도 적용할 수 있다고 한다.

이전에는 계속 유효성 검사 할 때 if 문으로 작성하거나 그랬었는데 이걸 이용하면 훨씬 간결해보인다.

다음 프로젝트에 적용 가능할까....싶지만(90% 불가능) 유데미 강의를 통해 새롭고 유익한 걸 알게 된 것 같다.