7. 익스프레스 (1) - 미들웨어 [10] : multer 2

 

 

 

 

 

 

앞서서 살펴본 multer 미들웨어 사용에 대한 내용을 이어서 살펴보겠습니다.

 

const multer = require('multer');

const upload = multer({
    storage: multer.diskStorage({
        destination(req, file, done) {
            done(null, 'uploads/');
        },
        filename(req, file, done) {
            const ext = path.extname(file.originalname);
            done(null, path.basename(file.originalname, ext) + Date.now() + ext);
        },
    }),
    limits: { fileSize: 5 * 1024 * 1024},
});

 

 

- multer 함수에 인수로 설정을 집어넣어 줍니다. multer의 인수 { } 안에 크게 storage와 limits가 존재합니다.   
- 우선 storage 속성에서는, multer.diskStorage 안에 destination과 filename을 설정했습니다. 이는 어디(destination)에 어떤 이름(filename)으로 저장할지를 설정하는 개념입니다.   

- destination과 filename 함수의 req 매개변수에는 요청에 대한 정보가 들어갑니다.
- destination과 filename 함수의 file 객체에는 업로드한 파일에 대한 정보가 들어갑니다. 
- destination과 filename 함수의 done 매개변수는 함수입니다.   
- req에는 에러가 있으면 에러를 넣고, file에는 실제 경로나 파일 이름을 넣어줍니다. req나 file의 데이터를 가공하여 done으로 넘겨주는 구조입니다. 

 

 

- 현재 설정으로는, 파일은 [uploads]라는 폴더에 [파일명+현재시각.확장자] 형태로 업로드 됩니다. 

- limits 속성에서는 파일 사이즈(바이트 단위) 5MB로 제한한 상태입니다. 

 

위 설정에서의 기본 전제 조건은, 서버에 'uploads' 폴더가 존재한다는 점입니다. 없을 경우 직접 생성하거나, fs 모듈을 사용해 서버 시작 시 생성해야 합니다. 

 

const fs = require('fs');

try {
    fs.readdirSync('uploads');
} catch (error) {
    console.error('uploads 폴더 없음. uploads 생성');
    fs.mkdirSync('uploads');
}

 

 

 

---

 

 

 

이러한 설정들이 끝나면, upload라는 변수가 생성됩니다. 여기에 다양한 미들웨어가 포함되어 있습니다. 

 

- single : 파일을 하나만 업로드 하는 경우에 사용합니다. 

app.post('/upload', upload.single('image'), (req, res) => {
    console.log(req.file, req.body);
    res.send('ok');
});

 

 

single 미들웨어를 라우터 미들웨어 앞에 넣어두면, multer 설정에 따라 파일 업로드 후 req.file 객체를 생성합니다. 이 때 인수는 input 태그의 name, 또는 폼 데이터의 키와 일치하게 넣습니다(여기서는 image). 업로드 성공 시, 결과는 req.file 객체 안에 들어 있으며, req.body에는 파일이 아닌 데이터인 title이 들어 있습니다. 여기서 req.file 객체의 형태는 다음과 같습니다. 

 

{
    filename: 'img',
    originalname: 'temp.png',
    encoding: '7bit',
    mimetype: 'image/png',
    destination: 'uploads/',
    filename: 'temp1514197844338.png',
    size: 53357
}