ABOUT ME

-

Today
-
Yesterday
-
Total
-
  • [Node.js] multer 미들웨어로 파일 받기
    웹개발/Node.js 2021. 8. 28. 14:11

     multer는 사용자에게 파일을 업로드 받게 하는 미들웨어이다.

     

     우선 multer를 이해하기 위해서 Node.js의 미들웨어 작동 형식을 알아보자.

    app.use(
    	morgan('dev'),
        express.static('/', path.join(__dirname, 'public')),
        express.json(),
        express.urlencoded({extended: false}),
        cookieParser(process.env.COOKIE_SECRET),
    );

     위의 코드는 express 프레임워크를 통해서 만든 app이라는 서버에 미들웨어를 연결시키는 것이다.

    숨겨진 메커니즘은 쉼표로 구분되는 각각의 미들웨어가 사실 next 함수의 호출로 연결된다는 것이다. 따라서 next 함수의 실행으로 클라이언트의 요청 하나에 묶여 있는 미들웨어가 다 같이 실행되는 것이다.

    next는 두 가지 방식으로 사용할 수 있는데 하나는 'route' 문자열 인수를 받아 다음 라우트를 실행하는 것이다. 그리고 나머지 하나는 err를 인수로 받아 에러를 처리하는 미들웨어로 넘기는 것이다.

     

    자 이제 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 : { filzesize : 5 * 1024 * 1024 }
    });

     multer를 진행중인 노드 프로젝트에 설치를 하고 설정을 해준다. 저장할 곳을 지정해주는 것이 storage 멤버에 해당하는 부분이고, 업로드된 파일의 이름을 지정해주는 것이 filename 멤버에 해당하는 부분이다. 저장할 곳을 지정해주는 uploads 폴더가 프로젝트 내부에 형성되어있지 않으면 에러가 난다. 이름을 지정할 때 주의할 점은, 다른 업로드될 파일과 이름이 최대한 겹치지 않게 준비를 해야한다. limits에서는 업로드 될 파일의 크기를 지정해줄 수 있다. 만들어진 multer의 객체 upload는 다음과 같이 쓰인다.

    app.post('/upload', upload.single(__input의 이름__), (req, res)=>{
    	console.log(req.file, req.body);
        	res.send("success");
    })
    
    // 여러 개의 파일을 하나의 input으로 받을 때
    app.post('/upload', upload.array(__input의 이름__), (req, res)=>{
    	console.log(req.files, req.body);
    	res.send("success too");
    })
    
    // 여러 개의 파일을 여러 input으로 받을 때
    app.post('/upload', upload.fields({ name : __input의 이름__}, {name : __input의 이름__}), (req, res) =>{
    	console.log(req.files, req.body);
        	res.send("end");
    })

     프론트엔드의 input의 이름과 upload가 호출하드 메소드 내에 인수에 입력되는 문자열을 동일하게 적어야된다는 것을 주의하자. 파일은 지정한 폴더인 'uploads'에 저장이된다. 필요할 때 해당 폴더에서 불러와서 사용하면 된다. multer는 업로드 순간의 일들만 처리한다.

    '웹개발 > Node.js' 카테고리의 다른 글

    [Node.js] express.Router로 라우팅하기  (0) 2021.08.28
Designed by Tistory.