[Nest.js] 맨땅에 헤딩 - Blog API 제작기 5편

평소에 Nest.js관련 글에 API 만들기 관련된 포스트가 없어 직접 만들면서 공부하게 되었습니다. 해당 블로그는 공부를 남기기 위한 용도입니다. 피드백 부탁드립니다.

1. 데이터를 받아보자.

이전 시간에는 데이터베이스 연결과 실제로 Data를 데이터베이스에 직접 생성을 해보는 시간을 가졌습니다.

로그인을 하기 위해서는 우선 우리는 Client ( 유저 )에게 아이디와 패스워드를 받을 필요가 있습니다.
Nest.js에서는 어떻게 데이터를 받는지 확인해보겠습니다.

@Post()
async login(@Body("userId") userId: string, @Body("password") password: string) {
  console.log(`userId is ${userId}`);
  console.log(`password is ${password}`);
}

다음과 같이 login.controller.ts에 작성 후 서버를 시작한 뒤 스웨거를 다시 보겠습니다.

하지만 스웨거를 보면 body에 데이터를 담을 수 있는 영역이 없습니다. 이를 위해서는 우리는 다시 Controller로 돌아와 한가지 작업을 더 해주어야합니다.

@Post()
@ApiBody({
  schema: {
    properties: {
      userId: { type: "string" },
      password: { type: "string" }
    }
  }
})
async login(@Body("userId") userId: string, @Body("password") password: string) {
  console.log(`userId is ${userId}`);
  console.log(`password is ${password}`);
}

이제 우리가 필요한 body의 프로퍼티가 보입니다. 아무런 문자열을 담아서 한번 실행해 보겠습니다.
콘솔창에 다음과 같이 떴으면 정상적으로 된 것입니다.

우리는 여기서 필요한 프로퍼티가 2개입니다. 하지만 추후에 어떠한 API에서는 프로퍼티가 10개가 필요하다면 어떨까요?
우리의 Controller는 가독성이 안좋아질 것 같습니다.

그래서 우리는 DTO( Data Transfer Object )라는 것을 선언해서 한 곳에서 관리를 해보겠습니다.

2. DTO를 사용해보자.

src/login/dto라는 폴더를 만들도록 하고 그 안에 login.dto.ts라는 파일도 생성하도록 하겠습니다.

또, Nest.js는 validation체크를 쉽게 할 수 있습니다.

npm install --save class-validator class-transformer

export class LoginDTO {
      @IsString()
    userId: string;
      @IsString()
    password: string;
}

@IsString()으로 우리는 userId와 password가 string 타입인지 쉽게 체크를 하고 아닐 경우 상세한 에러 메시지를 리턴해줍니다.

다음과 같이 우리가 로그인시에 필요한 body의 프로퍼티를 선언하고 export하도록 하겠습니다. 다시, Controller로 돌아와서 수정하도록 하겠습니다.

async login(@Body() loginDto: LoginDTO) {
  console.log(`userId is ${loginDto.userId}`);
  console.log(`password is ${loginDto.password}`);
}

이와 같은 형태로 사용한다면 가독성도 좋아지고 다루기 편해보입니다.
하지만, 아직 한가지 문제점이 있습니다. 이후에 DTO를 수정할 일이 생긴다면 login.dto.ts파일과 Controller에서 @ApiBody()를 동시에 수정해야합니다.

그래서 우리는 Controller에서 선언된 @ApiBody()를 지우고 login.dto.ts 파일을 수정해보도록 하겠습니다.

import { ApiProperty } from "@nestjs/swagger";

export class LoginDTO {
    @ApiProperty()
    userId: string;
    @ApiProperty()
    password: string;
}

어떤가요? 훨씬 편해보이지 않나요?

마지막으로 스웨거를 수정하는 김에 login API가 default 태그에 소속 되어있는 것을 변경해보도록 하겠습니다.
controller의 상단에서 @ApiTags()를 선언해서 변경해보도록 하겠습니다.

@Controller("login")
@ApiTags("Login")
export class LoginController {
  ...
}

3. 간단한 로그인 기능을 구현해보자.

이제 서비스에 로그인 기능을 구현해보도록 하겠습니다.

import { Injectable } from "@nestjs/common";
import { InjectRepository } from "@nestjs/typeorm";
import { User } from "src/entities/user.entity";
import { Repository } from "typeorm";
import { LoginDTO } from "./dto/login.dto";

import * as bcrypt from "bcrypt";

@Injectable()
export class LoginService {
    constructor(@InjectRepository(User) private readonly user: Repository<User>) {}

    async login(loginDto: LoginDTO) {
        try {
            const user = await this.user.findOne({
                userId: loginDto.userId
            });

            return await bcrypt.compare(loginDto.password, user.password);
        } catch (error) {
            console.error(error);

            return {
                result: false
            };
        }
    }
}

@Post()
async login(@Body() loginDto: LoginDTO) {
  return this.loginService.login(loginDto);
}

이제 API 호출 결과를 보겠습니다. 여러분이 생성한 userId와 password를 입력해서 API를 호출하면 결과값으로 true가 왔다면 잘 적용 된 것입니다. 다음 시간에는 로그인 기능을 더 구체적으로 작성해보도록 하겠습니다.