상세 컨텐츠

본문 제목

Express :: multer_이미지파일 업로드

Node/Express

by 비오스터딩 2021. 1. 5. 00:36

본문

파일이나 이미지를 서버로 보내기 위해서는 form data의 형태로 보내줘야한다.

express에 내장된 미들웨어인 body parser로는 처리할 수 없으므로,

이를 처리해줄 미들웨어 multer를 설치한다.

multer는 app에다가 장착할 수도 있지만, 보통은 라우터마다 적용시켜준다.

폼마다 데이터를 전송하는 형식이 다르기 때문이다.

 

 

multer 설정

이미지 업로드 요청을 처리할 라우터에 multer 설정을 하자.

우선은 multer를 불러온다.

 

  multer({                                  

  storage: 저장할 장소({        

                               destination(req, file, done) { 저장할 공간 },  

                                filename(req, file, done) { 저장할 파일 이름}  

  }),   

  limits: 파일 용량 제한        

  });        

일단은 저장위치를 하드디스크(diskStorage)로 지정했다.

 

컴퓨터 하드디스크에 저장하면 서버 스케일링할때 문제가 생긴다.

나중에 백엔드 서버가 요청을 많이 받으면

서버스케일링(가상으로 서버를 복사하여 작업을 처리하도록 하는 기술)이 필요하다.

하드디스크에 파일이 저장된다면, 서버를 복사할때마다 이미지가 같이 복사된다.

이는 서버의 공간을 많이 차지함으로 불필요한 비용이 발생한다.

그러므로 추후에 AWS에 배포해서 대체할 예정이다.

 

**

filename 파일명 중복될때, Nodejs는 기존파일에 덮어씌운다.

즉 이름이 같은 파일이 업로드되면 먼저 업로드한 파일이 없어진다.

그걸 방지하기위해 파일이름을 사용자가 업로드한 파일이름에 더하여 시간을 추가해준다.

 

 

multer 적용

미들웨어이므로 다음과같이 적용한다.

**image Input에서 전달한게 upload로 들어가도록 multer를 설정했다.

 

  router.post(URI, upload.메서드(key), 응답함수);  

 

single(key) : 한장만 전달 

array(key) : 여러장 전달

none() :텍스트만

fields(key) : form으로 넘어오는 file input이 두개 이상있을때

요청 URI, login검사, 이미지 올리기, 이미지업로드 후 실행

업로드된 이미지에 대한 정보가 req.files에 들어있다.

 

 

 

 

 

반응형

관련글 더보기

댓글 영역