[S3] api로 업로드한 이미지가 다운로드 되는 상황 해결

개발 환경

• language: typescript (node.js)
• framework: nestjs
• 사용 라이브러리: multerS3, @aws-sdk/client-s3

이슈 발생

api로 s3로 업로드 후 cloudfront로 이미지 url 접근 시 이미지 조회가 아닌 다운로드가 발생

이슈 해결

• 업로드 시 content-type을 정확하게 명시해주지 않아 나는 에러라고 한다.
• 업로드 시 content-type을 명시하자 해결되었다.

코드

storage: multerS3({
      s3,
      bucket: configService.get('AWS_BUCKET_NAME'),
      contentType(req, file, done) {
        done(null, file.mimetype);
      },
      key(req, file, done) {
        const fieldName = file.fieldname;
        const mimetype = file.mimetype.split('/');
        const basename = path.basename(file.originalname, `.${mimetype[1]}`);
        const key = `content/${basename}_${Date.now()}.${mimetype[1]}`;
        done(null, key);
      },
    }),
    limits: { fileSize: 10 * 1024 * 1024 }, // 10MB
  };

업로드 시 multer-s3에서 cotentType의 done 함수로 업로드하는 file의 mimetype을 지정해주면 해결된다.

참고한 블로그

https://beforb.tistory.com/124
https://blog.naver.com/PostView.naver?blogId=ks2414e&logNo=222418855995&categoryNo=0&parentCategoryNo=0&viewDate=¤tPage=1&postListTopCurrentPage=1&from=postView