[javascript] 자바스크립트로 파일 업로드 및 다운로드를 위한 서버 사이드 구현하기

파일 업로드와 다운로드는 웹 애플리케이션에서 주요 기능 중 하나입니다. 이 포스트에서는 Node.jsExpress 프레임워크를 사용하여 서버 측에서 파일 업로드 및 다운로드를 구현하는 방법에 대해 알아보겠습니다.

파일 업로드

먼저, 파일을 업로드하는 기능을 구현해 보겠습니다. 웹 애플리케이션에서 클라이언트가 파일을 선택하여 업로드하면 해당 파일을 서버에 저장해야 합니다.

Express 및 multer 라이브러리 설치

먼저, Express 및 multer 라이브러리를 설치해야 합니다. multerNode.jsmultipart/form-data를 다룰 때 사용되는 중간웨어입니다.

npm install express multer

파일 업로드 라우팅 구현

다음으로, 파일 업로드를 처리할 라우트를 구현합니다.

const express = require('express');
const multer  = require('multer');
const upload = multer({ dest: 'uploads/' });

const app = express();

app.post('/upload', upload.single('file'), (req, res) => {
  // 파일 업로드 처리
  res.send('파일이 성공적으로 업로드되었습니다.');
});

위 예제에서 upload.single('file')파일 HTML input 필드의 이름을 나타냅니다. 업로드된 파일은 서버의 uploads/ 디렉토리에 저장됩니다.

파일 다운로드

이제 파일 업로드와 마찬가지로 파일 다운로드도 구현해 보겠습니다. 클라이언트 측에서 파일을 요청하면 서버에서 해당 파일을 찾아 클라이언트로 전송합니다.

파일 다운로드 라우팅 구현

app.get('/download', (req, res) => {
  const file = `${__dirname}/path/to/file/example.pdf`;
  res.download(file); // 서버에서 클라이언트로 파일 전송
});

위 예제에서 /path/to/file/example.pdf는 클라이언트가 다운로드할 파일의 경로를 나타냅니다.

마치며

이제 자바스크립트를 사용하여 파일 업로드 및 다운로드를 처리하는 방법을 알게 되었습니다. Expressmulter 라이브러리를 이용하여 간단하게 파일 업로드 및 다운로드를 구현할 수 있습니다. 파일 업로드나 다운로드 구현 시 보안과 사용자 경험을 고려하여 개발하는 것이 중요합니다.

참고문헌: