AWS Lambda를 이용한 Image Resize 도입 (썸네일 이미지 성능 개선)

1. Lambda 도입 이유

만약 50X50 사이즈의 이미지를 로딩하는데 10MB 짜리 400X400 사이즈의 이미지를 이용한다면 리소스 낭비가 심하다. 

위와 같은 경우가 한 개가 아니라 여러 개일 경우 사용자가 체감하는 응답 시간은 꽤 클 것이다. 

 

이를 해결하기 위해 리사이징(RTesizing)기술을 사용하여 이미지 용량을 줄임으로써 속도를 빠르게하는 방법론은 이미 많은 사람들이 사용하고있다. 

 

하지만 이미지 리사이징 작업 같은 경우 CPU와 메모리를 많이 사용하기 때문에 로컬 서버에서 작업을 돌려버리면 다른 사용자의 요청을 못받는 현상이 생길수 있다.

 

그렇다고 따로 이미지 리사이징 전용 로컬 서버를 만들어 올린다 해도, 모든 사용자가 항상 이미지 리사이징 작업 기능을 이용하는 것도 아니기에 서버를 계속 돌린다는 것은 자원 낭비일수 있다.

 

 

이런 상황에서 AWS Lambda의 Server Less 서비스는 해결책이 될 수 있다. 

 

람다는 특정한 동작을 수행하는 로직을 저장하고 요청이 들어올 때 로직을 실행하는 서비스다. 마치 함수처럼 호출할 때 실행하여 FaaS라고 불린다. 이처럼 람다를 이용해 독립적인 서버에서 함수를 실행 시켜, 로컬 서버의 부담을 줄일수 있을 뿐만 아니라 온디멘드(on-demand) 형식이라 쓴만큼 요금을 지불하면 되서 항상 컴퓨팅을 실행시키는 자원 낭비를 줄일수 있다. 

 

람다의 요금은 다음과 같다.

 

 

 

 

 

 

 

2. S3 버킷 생성

먼저 기존 이미지를 저장하던 S3가 있다면 새로운 S3 버킷을 생성해준다. 

하나 버킷에서 경로를 나눠 해도 가능은 하지만, 재귀 호출이 될 수 있기 때문에 버킷을 나누는 것을 AWS에서도 권장하고있다. 

 

 

나의 경우 이렇게 총 3개의 버킷을 이용하고있다. 

 

1. jikgong-bucket: 나중에 뒤에서 Lambda를 생성할 때 소스 코드가 10MB 이상일 경우 S3에 올려서 사용해야하는데, 그때 사용

 

2. jikgong-image: 이미지를 저장할 버킷

 

3. jikgong-resize-bucket: jikgong-image에 올라간 이미지를 리사이징 해 저장할 버킷

 

S3 생성은 다른 블로그에 잘 나와있으니 따로 다루진 않겠다. (개인적으로 인파님 블로그가 자세하게 잘 알려주시는듯)

 

 

 

 

 

 

3. IAM 정책  & 역할 생성

AWS IAM 정책을 생성해줘야한다. 

 

정책 생성

 

직접 JSON을 입력해준다. 

jikgong-image 버킷에 대한 권한은 s3:GetObject, jikgong-resize-bucket 에 대한 권한은 s3:PutObject, s3:PutObjectAcl 을 부여해준다. 

 

나의 경우엔 PutObjectAcl 권한까지 부여해줘야 Lambda 함수가 정상적으로 동작했다. 없으면 Access Denied 에러가 떴었다.

 

AWS Lambda 사용 시 S3 Access Denied 에러 해결

{
    "Version": "2012-10-17",
    "Statement": [
        {
            "Effect": "Allow",
            "Action": [
                "logs:PutLogEvents",
                "logs:CreateLogGroup",
                "logs:CreateLogStream"
            ],
            "Resource": "arn:aws:logs:*:*:*"
        },
        {
            "Effect": "Allow",
            "Action": [
                "s3:GetObject"
            ],
            "Resource": "arn:aws:s3:::jikgong-image/*"
        },
        {
            "Effect": "Allow",
            "Action": [
                "s3:PutObject",
                "s3:PutObjectAcl" // 이거 필요
            ],
            "Resource": "arn:aws:s3:::jikgong-resize-bucket/*"
        }
    ]
}

 

 

 

 

 

역할 생성

바로 위에서 만든 정책을 사용할 역할을 생성해준다.

 

 

 

 

 

 

4. Lambda 함수에 사용할 함수 생성

이제 origin S3 버킷에 이미지가 업로드 되었을때 자동으로 resized 버킷에 리사이징된 이미지가 저장되도록 함수를 만들어야한다. 여러가지 언어를 지원하지만 나는 Java17로 진행하였다.

Node.js로 진행할 경우 콘솔의 코드 편집기로 바로 코드 작성이 가능하지만 java17은 해당 기능을 지원하지 않기 때문에 인텔리제이 또는 이클립스를 이용해 함수(메소드)를 작성 후 zip파일을 빌드하는 과정을 거쳐야 한다.

 

- build.gradle 의존성 추가

implementation group: 'com.amazonaws', name: 'aws-lambda-java-core', version: '1.2.1'
implementation group: 'com.amazonaws', name: 'aws-lambda-java-events', version: '3.7.0'
implementation group: 'com.amazonaws', name: 'aws-java-sdk', version: '1.11.969'

 

- lambda 함수 작성

아래 함수는 AWS에서 제공하는 예제코드를 나에게 맞게 수정한 코드이다. 

package jikgong;

import com.amazonaws.services.lambda.runtime.LambdaLogger;
import com.amazonaws.services.lambda.runtime.events.models.s3.S3EventNotification.S3EventNotificationRecord;
import com.amazonaws.services.s3.model.CannedAccessControlList;
import com.amazonaws.services.s3.model.PutObjectRequest;
import java.awt.Color;
import java.awt.Graphics2D;
import java.awt.RenderingHints;
import java.awt.image.BufferedImage;
import java.io.ByteArrayInputStream;
import java.io.ByteArrayOutputStream;
import java.io.IOException;
import java.io.InputStream;
import java.util.regex.Matcher;
import java.util.regex.Pattern;
import javax.imageio.ImageIO;
import com.amazonaws.AmazonServiceException;
import com.amazonaws.services.lambda.runtime.Context;
import com.amazonaws.services.lambda.runtime.RequestHandler;
import com.amazonaws.services.lambda.runtime.events.S3Event;
import com.amazonaws.services.s3.AmazonS3;
import com.amazonaws.services.s3.model.GetObjectRequest;
import com.amazonaws.services.s3.model.ObjectMetadata;
import com.amazonaws.services.s3.model.S3Object;
import com.amazonaws.services.s3.AmazonS3ClientBuilder;

public class ResizeHandler implements RequestHandler<S3Event, String> {

    private static final float MAX_HEIGHT = 60;
    private final String JPG_TYPE = (String) "jpg";
    private final String JPG_MIME = (String) "image/jpeg";
    private final String JPEG_TYPE = (String) "jpeg";
    private final String JPEG_MIME = (String) "image/jpeg";
    private final String PNG_TYPE = (String) "png";
    private final String PNG_MIME = (String) "image/png";
    private final String GIF_TYPE = (String) "gif";
    private final String GIF_MIME = (String) "image/gif";

    public String handleRequest(S3Event s3event, Context context) {
        LambdaLogger logger = context.getLogger();
        try {
            S3EventNotificationRecord record = s3event.getRecords().get(0);
            String srcBucket = record.getS3().getBucket().getName(); // 원본 버킷 이름
            String key = record.getS3().getObject().getUrlDecodedKey(); // 객체의 키 (파일 경로 및 이름)
            String dstBucket = "jikgong-resize-bucket"; // 수정된 저장될 버킷 이름


            // 파일 확장자 추출
            Matcher matcher = Pattern.compile(".*\\.([^\\.]*)").matcher(key);
            if (!matcher.matches()) {
                logger.log("Unable to infer image type for key " + key);
                return "";
            }
            String imageType = matcher.group(1);
            // 지원하지 않는 이미지 형식인 경우 로그를 남기고 리턴
            if (!(JPG_TYPE.equals(imageType)) && !(JPEG_TYPE.equals(imageType)) && !(PNG_TYPE.equals(imageType)) && !(GIF_TYPE.equals(imageType))) {
                logger.log("Skipping non-image " + key);
                return "";
            }

            // S3에서 이미지 가져오기
            AmazonS3 s3Client = AmazonS3ClientBuilder.defaultClient();
            S3Object s3Object = s3Client.getObject(new GetObjectRequest(srcBucket, key));
            InputStream objectData = s3Object.getObjectContent();

            // 이미지 리사이징 처리
            BufferedImage srcImage = ImageIO.read(objectData);
            int srcHeight = srcImage.getHeight();
            int srcWidth = srcImage.getWidth();
            int width = (int) (srcWidth * (MAX_HEIGHT / srcHeight)); // 비율에 맞춰 너비 계산
            int height = (int) MAX_HEIGHT;

            // 새 이미지 버퍼 생성 및 그래픽 설정
            BufferedImage resizedImage = new BufferedImage(width, height, BufferedImage.TYPE_INT_RGB);
            Graphics2D g = resizedImage.createGraphics();
            g.setPaint(Color.white);
            g.fillRect(0, 0, width, height);
            g.setRenderingHint(RenderingHints.KEY_INTERPOLATION, RenderingHints.VALUE_INTERPOLATION_BILINEAR);
            g.drawImage(srcImage, 0, 0, width, height, null);
            g.dispose();

            // 바이트 배열로 변환
            ByteArrayOutputStream os = new ByteArrayOutputStream();
            ImageIO.write(resizedImage, imageType, os);
            InputStream is = new ByteArrayInputStream(os.toByteArray());
            ObjectMetadata meta = new ObjectMetadata();
            meta.setContentLength(os.size()); // 메타데이터 설정
            meta.setContentType(getMimeType(imageType)); // MIME 타입 설정

            // 리사이즈된 이미지를 S3에 저장
            logger.log("Writing to: " + dstBucket + "/" + key);
            try {
                s3Client.putObject(new PutObjectRequest(dstBucket, key, is, meta).withCannedAcl(CannedAccessControlList.PublicRead));
            } catch (AmazonServiceException e) {
                logger.log(e.getErrorMessage());
                System.exit(1);
            }
            logger.log("Successfully resized " + srcBucket + "/" + key + " and uploaded to " + dstBucket + "/" + key);
            return "Ok";
        } catch (IOException e) {
            throw new RuntimeException(e);
        }
    }

    // MIME 타입을 반환하는 보조 메소드
    private String getMimeType(String imageType) {
        switch(imageType) {
            case JPG_TYPE:
            case JPEG_TYPE:
                return JPG_MIME;
            case PNG_TYPE:
                return PNG_MIME;
            case GIF_TYPE:
                return GIF_MIME;
            default:
                return "";
        }
    }
}

 

 

build.gradle에 다음과 같은 코드를 추가하고 `gradle build`를 진행하자.

task buildZip(type: Zip) {
    from compileJava
    from processResources
    into('lib') {
       from configurations.runtimeClasspath
    }
}

 

 

나는 아래의 명령어를 통해 zip 파일을 생성해주었다. 

./gradlew buildZip

 

 

생성이 완료되면 아래 경로에 zip 파일이 생성된다.

 

이렇게 생성한 zip 파일을 S3에 업로드해준다. 

파일 사이즈가 커 S3를 URL을 통해 AWS Lambda에 적용할 예정이다.

 

 

 

 

5. Lambda 함수 생성

함수 이름을 입력하고, 

사용할 언어(작성한 함수 언어)를 선택해준다. 위에서 Java17을 이용했기 때문에 나는 Java17 선택했다.

그리고 기존 실행 역할 변경에서, 위에서 생성했던 역할을 선택해준다. 

 

 

코드 소스를 업로드 해줘야한다. 아까 위에서 zip파일을 S3에 업로드했는데, 그 URL을 여기 입력해주면 된다.

 

바로 밑에 런타임 설정을 편집해준다.

사용한 언어와 패키지, 클래스, 메소드 명을 입력해준다. 패키지명은 위에서 작성한 함수 맨 위에 명시되어있을 것이다. 

 

 

 

 

마지막으로 트리거를 추가해준다. 

 

 

이렇게 리사이징을 수행하는 AWS Lambda 설정이 끝났다. 

추가로 람다에서 작업한 로그들은 모니터링 -> Cloud Watch Logs 에서 확인할 수 있다. 

 

 

 

 

 

 

 

6. 결과

S3에 이미지를 업로드하여 AWS Lambda에서 리사이징을 잘 수행하는지 테스트해보았다. 

 

왼쪽이 원본 이미지의 크기이고, 오른쪽은 리사이징 작업을 완료한 이미지이다. 

상당한 크기 차이를 보여준다. 

 

 

 

 

 

 

 

7. 프로젝트에서 리사이징된 이미지 활용

위에선 jikgong-image 버킷에 들어가는 모든 이미지에 전부 트리거가 걸려 resize를 진행하게 되는데 실제론 썸네일 이미지에 대해서만 resize를 진행해야한다. 

 

따라서 아래와 같이 Prefix 조건을 두어 thumbnail만 처리하도록 변경하였다. 

 

 

이제 이미지를 저장할 때 썸네일에 대해선 storeName 앞에 thumbnail prefix를 붙여주면 그 이미지에 대해서만 resize를 진행하게 될 것이다.

 

- 저장할 때 prefix 설정

// unique 이름 생성
String storeImageName = createStoreImageName(extension);
// 썸네일 이미지라면 Prefix를 등록해 AWS Lambda가 실행되도록 세팅
String prefix = isFirst ? "thumbnail_" : "";
storeImageName = "jobPost/" + prefix + storeImageName;

 

- thumbnail url 조회

    // 버킷에서 이미지 조회
    public String getImgPath(String fileName) {
        if (amazonS3Client.doesObjectExist(bucket, fileName)) {
            return amazonS3Client.getUrl(bucket, fileName).toString();
        } else {
            throw new CustomException(ErrorCode.S3_NOT_FOUND_FILE_NAME);
        }
    }

    // resize버킷에서 이미지 조회
    public String getThumbnailImgPath(String fileName) {
        if (amazonS3Client.doesObjectExist(resize_bucket, fileName)) {
            return amazonS3Client.getUrl(resize_bucket, fileName).toString();
        } else {
            // resize_bucket에 파일이 없을 경우, 메인 bucket에서 검색
            if (amazonS3Client.doesObjectExist(bucket, fileName)) {
                log.warn("resize_bucket 에서 조회를 시도했지만, bucket에만 존재");
                return amazonS3Client.getUrl(bucket, fileName).toString();
            } else {
                // 두 버킷 모두에 파일이 없을 경우 예외 발생
                throw new CustomException(ErrorCode.S3_NOT_FOUND_FILE_NAME);
            }
        }
    }

 

 

 

 

나의 프로젝트에서 리사이징된 이미지를 사용하는 경우는 모집 공고 목록을 조회할 때이다. 이때 많은 썸네일 이미지들을 작은 크기로 보여주게 된다. 만약 여기 사용될 이미지로 원본 이미지를 사용하게 될 경우 로딩 시간이 길어지게된다. 

 

따라서 일자리 모집공고 목록 조회 시 thumbnail 이미지를 찾아 resize된 url을 반환할 수 있도록 코드를 짰다. 

아래는 일부 코드이다.

// querydsl
Page<JobPost> jobPostPage = jobPostRepository.getMainPage(worker.getId(), techList, workDateList, scrap, meal, park, location, sortType, pageable);
List<JobPostListResponse> jobPostListResponseList = jobPostPage.getContent().stream()
        .map(jobPost -> {
            // Thumbnail 이미지 추출
            Optional<JobPostImage> thumbnailImage = jobPost.getJobPostImageList().stream()
                    .filter(JobPostImage::isThumbnail)
                    .findFirst();

            // Thumbnail URL을 추출하고, 썸네일 이미지가 없을 경우 null 처리
            String thumbnailS3Url = thumbnailImage
                    .map(JobPostImage::getStoreImgName)  // Optional이 비어있지 않다면 getStoreImgName 실행
                    .map(s3Handler::getThumbnailImgPath)  // s3Handler를 사용해 url 조회
                    .orElse(null);  // Thumbnail 이미지가 없으면 null 반환

            return JobPostListResponse.from(jobPost, location, thumbnailS3Url);
        })
        .collect(Collectors.toList());

 

 

 

 

 

 

8. 성능 비교

동일한 사진에 resize된 썸네일 이미지 url을 랜더링 했을 때 Latency와, 원본 이미지를 랜더링 했을 때 Latency이다. 

 

이미지를 불러오는데만 계산하면

리사이징된 이미지를 불러오는데 총 926ms가 걸렸고, 원본 이미지를 불러오는덴 19090ms가 걸렸다.

 

대략 95.15%의 성능을 향상시킬 수 있었다.