> 웹 프론트엔드 > JS 튜토리얼 > Multer를 사용하여 Node.js에서 파일 업로드 처리: 종합 가이드

Multer를 사용하여 Node.js에서 파일 업로드 처리: 종합 가이드

Mary-Kate Olsen
풀어 주다: 2024-11-18 10:02:02
원래의
486명이 탐색했습니다.

Handling File Uploads in Node.js with Multer: A Comprehensive Guide

웹 개발 세계에서는 파일 업로드 처리가 일반적인 요구 사항입니다. 프로필 사진, 문서, 이미지 등 많은 애플리케이션에서는 파일을 안전하고 효율적으로 업로드하고 저장해야 합니다. Express와 함께 Node.js를 사용할 때 Multer는 이 작업을 원활하게 처리하는 데 사용할 수 있는 최고의 라이브러리 중 하나입니다.

이 블로그에서는 설치, 구성, 저장 옵션, 파일 필터링, 일반적인 사용 사례 등 Node.js에서 Multer를 사용하는 데 필요한 모든 내용을 코드 예제와 함께 다룹니다.


목차

  1. 멀터란 무엇인가요?
  2. 설치
  3. Express로 Multer 설정
  4. 스토리지 옵션 이해
    • 디스크 스토리지
    • 메모리 저장
    • 클라우드 스토리지(S3 예시)
  5. 파일 유형별 필터링
  6. 파일 크기 제한
  7. 다중 파일 업로드 처리
  8. Multer의 오류 처리
  9. 실제 사용 사례
  10. 결론

멀터란 무엇인가?

Multer는 웹 애플리케이션에서 파일을 업로드하는 데 일반적으로 사용되는 형식인 multipart/form-data를 처리하기 위한 미들웨어입니다. Express와 함께 작동하도록 특별히 설계되었으며 다음을 제공하여 파일 업로드를 관리하는 데 도움이 됩니다.

  • 파일 저장소: 서버나 기타 저장소 서비스에 파일을 저장하기 위한 구성 가능한 저장소 옵션입니다.
  • 파일 필터링: 파일 형식에 대한 제한 설정을 허용합니다.
  • 크기 제한: 과도한 데이터 업로드를 방지하기 위해 파일 크기를 제한하는 데 도움이 됩니다.

설치

Multer를 시작하려면 npm을 통해 설치하세요.

npm install multer
로그인 후 복사
로그인 후 복사

Express를 사용하여 Multer 설정

Express 애플리케이션에서 Multer를 사용하여 기본 파일 업로드 핸들러를 설정하는 것부터 시작해 보겠습니다. 시작하는 방법은 다음과 같습니다.

const express = require('express');
const multer = require('multer');
const app = express();

// Configure Multer for basic usage
const upload = multer({ dest: 'uploads/' }); // Destination folder for uploaded files

// Single File Upload Route
app.post('/upload', upload.single('file'), (req, res) => {
  res.send('File uploaded successfully!');
});

app.listen(3000, () => console.log('Server running on port 3000'));
로그인 후 복사
로그인 후 복사

이 예에서는:

  • upload.single('file'): 이 미들웨어는 키 파일과 함께 업로드된 단일 파일을 처리합니다.
  • 업로드된 파일은 uploads/ 폴더에 저장됩니다.

스토리지 옵션 이해

Multer는 두 가지 기본 저장 옵션을 제공합니다.

  1. 디스크 저장소: 서버에 로컬로 파일을 저장합니다.
  2. 메모리 저장소: 파일을 버퍼 개체로 메모리에 저장합니다(메모리에서 파일을 처리하는 데 유용함).

1. 디스크 스토리지

디스크 저장소를 사용하면 파일 이름 지정 및 대상 경로를 더 효과적으로 제어할 수 있습니다.

npm install multer
로그인 후 복사
로그인 후 복사
  • 대상: 파일 업로드를 위한 폴더를 지정합니다.
  • 파일 이름: 파일 이름을 사용자 정의할 수 있습니다(예: 고유성을 위해 타임스탬프 추가).

2. 메모리 저장

메모리 저장소에는 파일이 버퍼로 저장되는데, 이는 수명이 짧은 파일이나 디스크에 파일을 저장하지 않고 업로드를 처리하는 데 유용합니다.

const express = require('express');
const multer = require('multer');
const app = express();

// Configure Multer for basic usage
const upload = multer({ dest: 'uploads/' }); // Destination folder for uploaded files

// Single File Upload Route
app.post('/upload', upload.single('file'), (req, res) => {
  res.send('File uploaded successfully!');
});

app.listen(3000, () => console.log('Server running on port 3000'));
로그인 후 복사
로그인 후 복사

클라우드 스토리지: Multer와 AWS S3

프로덕션 애플리케이션의 경우 파일을 클라우드 스토리지(예: AWS S3)에 직접 저장하는 것이 더 나은 경우가 많습니다. S3와 통합하려면 multer-s3을 사용하세요.

const storage = multer.diskStorage({
  destination: (req, file, cb) => cb(null, 'uploads/'), // Folder location
  filename: (req, file, cb) => {
    const uniqueSuffix = Date.now() + '-' + Math.round(Math.random() * 1E9);
    cb(null, uniqueSuffix + '-' + file.originalname);
  }
});

const upload = multer({ storage: storage });
로그인 후 복사
const upload = multer({ storage: multer.memoryStorage() });
로그인 후 복사

이 설정은 로컬 저장소를 거치지 않고 지정된 S3 버킷에 직접 파일을 업로드합니다.


유형별 파일 필터링

유형별로 파일을 필터링하여 특정 파일 형식(예: 이미지)만 허용할 수 있습니다. fileFilter 옵션을 사용하세요.

npm install aws-sdk multer-s3
로그인 후 복사

파일 크기 제한

대용량 파일이 업로드되는 것을 방지하려면 제한 옵션을 설정하세요. 파일 크기를 1MB로 제한하는 방법은 다음과 같습니다.

const aws = require('aws-sdk');
const multerS3 = require('multer-s3');

aws.config.update({ region: 'your-region' });

const s3 = new aws.S3();

const upload = multer({
  storage: multerS3({
    s3: s3,
    bucket: 'your-s3-bucket-name',
    metadata: (req, file, cb) => cb(null, { fieldName: file.fieldname }),
    key: (req, file, cb) => cb(null, Date.now().toString() + '-' + file.originalname)
  })
});
로그인 후 복사

여러 파일 업로드 처리

Multer는 다중 파일 업로드도 지원합니다.

const fileFilter = (req, file, cb) => {
  // Accept only image files
  if (file.mimetype.startsWith('image/')) {
    cb(null, true); // Accept file
  } else {
    cb(new Error('Only image files are allowed!'), false); // Reject file
  }
};

const upload = multer({
  storage: storage,
  fileFilter: fileFilter
});
로그인 후 복사
  • upload.array('files', 5): 동일한 필드에 최대 5개의 파일을 업로드할 수 있습니다.
  • upload.fields: 다양한 필드 이름을 가진 파일 처리를 활성화합니다.

Multer의 오류 처리

원활한 사용자 경험을 위해서는 적절한 오류 처리가 중요합니다. Multer는 다음과 같이 처리할 수 있는 여러 유형의 오류를 발생시킬 수 있습니다.

const upload = multer({
  storage: storage,
  limits: { fileSize: 1 * 1024 * 1024 } // 1 MB limit
});
로그인 후 복사

실제 사용 사례

다음은 Multer를 사용하기 위한 실제 애플리케이션입니다.

  1. 프로필 이미지 업로드: 사용자가 프로필 사진을 업로드하고 서버나 S3에 저장하며 파일 경로를 데이터베이스에 저장할 수 있습니다.
  2. 문서 저장소: 사용자가 제출한 문서(예: 이력서, PDF)를 맞춤형 저장소 및 필터링 구성으로 저장합니다.
  3. 전자상거래의 미디어 파일: 공급업체가 제품 이미지를 업로드하고, 파일 형식과 크기를 제한하고, 쉽게 검색할 수 있도록 클라우드 저장소에 저장할 수 있습니다.

결론

Multer는 유연한 저장 옵션, 파일 필터링을 제공하고 단일 파일에서 여러 파일에 이르기까지 다양한 업로드 요구 사항을 처리하여 Node.js 애플리케이션에서 파일 처리를 단순화합니다. 소규모 앱을 구축하든 파일 처리가 필요한 프로덕션 수준 애플리케이션을 구축하든 Multer가 도와드립니다.

즐거운 코딩하세요! ?

위 내용은 Multer를 사용하여 Node.js에서 파일 업로드 처리: 종합 가이드의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

원천:dev.to
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
저자별 최신 기사
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿