[javascript] 자바스크립트로 파일 업로드 및 다운로드를 위한 서버 사이드 구현하기
파일 업로드와 다운로드는 웹 애플리케이션에서 주요 기능 중 하나입니다. 이 포스트에서는 Node.js와 Express 프레임워크를 사용하여 서버 측에서 파일 업로드 및 다운로드를 구현하는 방법에 대해 알아보겠습니다.
파일 업로드
먼저, 파일을 업로드하는 기능을 구현해 보겠습니다. 웹 애플리케이션에서 클라이언트가 파일을 선택하여 업로드하면 해당 파일을 서버에 저장해야 합니다.
Express 및 multer 라이브러리 설치
먼저, Express 및 multer 라이브러리를 설치해야 합니다. multer
는 Node.js의 multipart/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
는 클라이언트가 다운로드할 파일의 경로를 나타냅니다.
마치며
이제 자바스크립트를 사용하여 파일 업로드 및 다운로드를 처리하는 방법을 알게 되었습니다. Express와 multer 라이브러리를 이용하여 간단하게 파일 업로드 및 다운로드를 구현할 수 있습니다. 파일 업로드나 다운로드 구현 시 보안과 사용자 경험을 고려하여 개발하는 것이 중요합니다.
참고문헌: