이번 velog클론 코딩을 하면서 게시판에 이미지를 올릴 수 있는 방법에 대해서 알아보게 되었다.
이미지자체가 파일이며 텍스트에 비해서 대용량을 차지하기 때문에 대용량 파일 전송에 및 저장에 대해 찾아보게 되고
node.js에서 간단한 라이브러리 설치를 통해 이를 실현할 수 있는 방법으로 multer라이브러리가 있는 것을 알게 되었다.
위에 설명한 대로 node.js에서 npm을 통한 패키지 관리자로 설치할 수 있는 라이브러리이며 미들웨어로서의 기능을 가진다.
middleWare로 기능하기 때문에 API의 요청에 대한 응답이 오기 전에 이미 한번 거쳐가는 방식이라 API요청에 대한 응답의 올바름 또는 에러와 상관 없이 관련 저장소에 저장하게 된다.
나는 대용량 파일을 저장하기 위해서 AWS의 S3 스토리지를 사용하기 위해 multer-s3도 같이 사용하였다.
사용법은 링크 multer-S3 readme github 를 참고하자
S3스토리지 를 위한 AWS 자격증명설정 코드
import { S3 } from '@aws-sdk/client-s3';
const s3 = new S3({
region: 'ap-northeast-2',
credentials: {
accessKeyId: process.env.S3_ACCESS_KEY_ID as string,
secretAccessKey: process.env.S3_SECREY_ACCESS_KEY as string,
},
});
export default s3;
multer라이브러리와 multer-S3를 이용함 middleWare 구성 코드
import { Request } from 'express';
import * as multer from 'multer';
import * as multers3 from 'multer-s3';
import * as shortid from 'shortid';
import { badRequest } from '@hapi/boom';
import s3 from '../config/AWS.s3';
const multeruploader = multer({
storage: multers3({
s3,
bucket: process.env.S3_BUCKET_NAME as string,
acl: 'public-read',
key(req, file, callback) {
callback(
null,
`clon-project/${Date.now()}_${shortid.generate()}.${
file.originalname.split('.')[file.originalname.split('.').length - 1]
}`
);
},
}),
limits: { fileSize: 20 * 1024 * 1024 }
});
export default multeruploader;