29.이미지 업로드 및 미디어 관리, Nest.js에서 파일 업로드 API 구축

1. Nest.js 소개

Nest.js는 모던 JavaScript와 TypeScript 기반의 웹 애플리케이션 프레임워크입니다. 엔터프라이즈 애플리케이션을 구축하기 위해 필요한 기능을 갖추고 있으며, 효율적인 모듈화와 테스트 용이성을 제공합니다. 기존의 Express.js에 기반하고 있지만, 더 많은 기능과 구조를 제공합니다.

2. 파일 업로드 API 구축의 필요성

파일 업로드는 웹 애플리케이션에서 흔히 필요한 기능 중 하나입니다. 사용자에게 파일을 업로드할 수 있는 기능을 제공함으로써 다양한 서비스—사진 공유, 문서 첨부, 미디어 관리—를 가능하게 합니다. 이러한 API를 통해 사용자는 사용자의 데이터를 서버에 안전하게 저장할 수 있습니다.

3. Nest.js 프로젝트 설정하기

먼저 Nest.js 프로젝트를 설정해야 합니다. 아래 명령어를 사용하여 프로젝트를 생성합니다.

npm i -g @nestjs/cli
nest new media-upload

프로젝트를 생성한 후, 필요한 모듈을 설치합니다. 주요 모듈로는 multer와 @nestjs/platform-express가 있습니다.

npm install --save multer @nestjs/platform-express

4. 이미지 업로드를 위한 DTO 설계

이미지 업로드를 처리하기 위한 데이터 전송 객체(DTO)를 설계합니다. DTO는 클라이언트와 서버 간에 데이터가 전송될 때의 구조를 정의합니다. 아래는 파일 업로드를 위한 간단한 DTO 예시입니다.

import { IsNotEmpty } from 'class-validator';
        
        export class UploadImageDto {
            @IsNotEmpty()
            readonly image: Express.Multer.File;
        }

5. 파일 업로드를 위한 서비스 구현

이제 파일 업로드를 처리할 서비스를 구현해야 합니다. 이를 위해, ‘upload.service.ts’ 파일을 생성하고 다음의 내용을 구현합니다.

import { Injectable } from '@nestjs/common';
        import { join } from 'path';
        import { v4 as uuid } from 'uuid';
        
        @Injectable()
        export class UploadService {
            async uploadFile(file: Express.Multer.File): Promise {
                const fileName = `${uuid()}-${file.originalname}`;
                const filePath = join(__dirname, '..', '..', 'uploads', fileName);
                // file system API 등을 사용해 파일을 저장
                return filePath;
            }
        }

위의 서비스에서는 UUID를 사용하여 파일 이름을 생성하고, 파일이 업로드될 경로를 정의합니다. 이후 파일 시스템 API를 사용하여 파일을 저장합니다.

6. 파일 업로드를 위한 컨트롤러 구현

이제 사용자가 파일을 업로드할 수 있도록 제어하는 컨트롤러를 작성합니다. 아래는 ‘upload.controller.ts’의 예시입니다.

import { Controller, Post, UseInterceptors, UploadedFile, Body } from '@nestjs/common';
        import { FileInterceptor } from '@nestjs/platform-express';
        import { UploadService } from './upload.service';
        import { UploadImageDto } from './dto/upload-image.dto';
        
        @Controller('uploads')
        export class UploadController {
            constructor(private readonly uploadService: UploadService) {}
        
            @Post('image')
            @UseInterceptors(FileInterceptor('image'))
            async uploadImage(@UploadedFile() file: Express.Multer.File, @Body() uploadImageDto: UploadImageDto) {
                const filePath = await this.uploadService.uploadFile(file);
                return { url: filePath };
            }
        }

위의 컨트롤러에서는 HTTP POST 요청을 처리하여 사용자가 업로드한 이미지 파일을 받아 처리합니다. ‘FileInterceptor’를 사용하여 파일 업로드를 간편하게 처리할 수 있습니다.

7. 업로드 경로 설정하기

파일이 업로드될 경로를 설정하는 방법입니다. Nest.js에서는 multer를 사용하여 파일 업로드를 쉽게 처리할 수 있습니다. 기본적으로 multer의 저장 옵션을 사용하거나, 사용자가 원하는 경로를 지정할 수 있습니다.

import { multerOptions } from './multer.options';

        export const multerOptions = {
            storage: multer.diskStorage({
                destination: (req, file, cb) => {
                    cb(null, 'uploads/');
                },
                filename: (req, file, cb) => {
                    cb(null, `${uuid()}-${file.originalname}`);
                },
            }),
        };
        

8. 미디어 관리 API 구축

이미지 업로드 API 외에도 미디어 관리를 위한 API를 구축하는 방법도 설명하겠습니다. 사용자는 업로드한 미디어 파일을 조회, 삭제할 수 있어야 합니다. 이를 위한 간단한 API를 작성해보겠습니다.

import { Controller, Get, Delete, Param } from '@nestjs/common';

        @Controller('media')
        export class MediaController {
            @Get()
            findAll() {
                // DB에서 모든 미디어 파일 조회
                return mediaList;
            }

            @Delete(':id')
            remove(@Param('id') id: string) {
                // 특정 미디어 파일 삭제 처리
                return { message: 'File removed' };
            }
        }

9. 테스트 및 디버깅

이제 모든 컴포넌트가 준비되었으므로, API를 테스트하고 디버깅하는 단계입니다. Postman 또는 Insomnia와 같은 도구를 사용하여 API를 호출하고, 정상적으로 작동하는지 확인합니다.

10. 마치며

이번 포스트에서는 Nest.js를 사용하여 이미지 업로드 및 미디어 관리 API를 구축하는 방법에 대해 알아보았습니다. Nest.js는 TS 기반 프레임워크로, 멀티미디어 파일 처리를 효율적으로 할 수 있도록 도와줍니다. 이와 같은 기능은 웹 애플리케이션 개발의 필수적인 요소로, 이를 통해 사용자에게 더 나은 경험을 제공할 수 있습니다. 추가적으로, 여러 가지 보안 또는 관리 기능을 추가하여 서비스를 더욱 안전하게 사용할 수 있도록 할 수 있습니다.