lambda
작은 화면이나 모바일에선 리사이징된 이미지를 보여줌으로서 사용자의 데이터 소모를 줄여줄 수 있는데 이때 lambda를 사용한다.
- 분리된 컴퓨터고 클라우드 서비스이기 때문에 무거운 작업과 지속적으로 해야 하는 작업이 있다면 lambda로 빼는 것이 좋다.
- 24시간 돌아가는 개념이 아닌 호출을 했을 때만 실행되는 함수의 개념이다.
블로그를 조금 더 뒤적여 람다의 정의를 정리해보자.
람다는 내 서버가 필요없이 aws 서버가 알아서 처리를 해준다.
다른 aws 서비스에서 코드를 자동으로 트리거하도록 설정할 수 있다. (ex s3의 데이터 가져오기)
즉, 개발자가 백엔드로 로직만 개발하면 aws 람다를 통해 직접 서버에 소스코드를 올리거나 설정할 필요없이 서비스가 운영(트리거)될 수 있도록 만들어준다.lambda 만들기
- lambda 폴더 및 파일 생성
-index.js
-package.json- npm aws-sdk 설치
npm i aws-sdk
npm i sharp- index.js 파일 -1
const AWS = require('aws-sdk');
const Sharp = require('sharp');
const S3 = new AWS.S3({ region : 'ap-northeast-2' });
// 언제 람다가 실행되는지 결정
// ajax로 요청을 보내거나 브라우저로 접근하거나 이럴 때 람다를 실행시킬 수도 있지만
// 이 프로젝트의 경우 s3에 새로운 이미지가 올라갔을 때 람다를 실행하는 것으로 코드 기재
exports.handler = async (event, context, callback) => {
const Bucket = event.Records[0].s3.bucket.name;
// 경로명
const Key = event.Records[0].s3.object.key;
// 파일이름을 확장자까지 추출
const filename = Key.split('/')[Key.split('/').length - 1];
// 확장자 추출
const ext = Key.split('.')[Key.split('.').length - 1];
console.log( Bucket, Key, filename, ext );
const requiredFormat = ext === 'jpg' ? 'jpeg' : ext;
try {
const s3Object = await S3.getObject({
Bucket,
Key,
}).promise();
console.log('original', s3Object.Body.length);
return callback(null, '');
} catch(e) {
console.error(e);
return callback(e);
}
};
try 문에서 s3의 버킷정책에 기재했던 getObject로 버킷과 경로를 가져온다.
s3Object에 원본 이미지가 있고 그 안의 Body에 실제 데이터가 들어있고 length로 사이즈를 알 수 있다.
- index.js 파일 -2
try {
// s3로부터 이미지 데이터 가져오기
const s3Object = await S3.getObject({
Bucket,
Key,
}).promise();
console.log('original', s3Object.Body.length);
// 이미지 리사이징 시키기
const resizedImage = await Sharp(s3Object.Body).resize(800, 800, {
fit : 'inside'
})
.toFormat(requiredFormat)
.toBuffer();
// s3로 이미지 데이터 넣기
await S3.putObject({
Bucket,
Key: `thumb/${filename}`,
Body : resizedImage,
}).promise();
return callback(null, `thumb/${filename}`);
} catch(e) {
console.error(e);
return callback(e);
}
lambda는 리눅스에서만 작동을 하기 때문에 윈도우에서 작업한 것을 리눅스에 배포를 하면 동작을 안 한다.
그럼 어떻게 해야 할까?
ec2 같은 리눅스에서 람다를 빌드해서 이것을 윈도우로 가져와서 업로드를 한다.
그러니까... Sharp같은 메서드가 윈도우에서 동작을 안 하기 때문에 윈도우에서 돌게끔하려면 한 번의 정제를 거쳐야 한다는 의미 같은데 이것이 너무 번거로우니 강의에서는 클라우디아 라는 노드 서비스를 사용했다.
윈도우 배포 환경에서는 클라우디아 도움을 받아서 람다를 사용하자
1. claudia 설치
npm i -g claudia2. 아마존 설정하기
cd ~ : 홈으로 이동
mkdir .aws : .aws라는 폴더 만들기
cd .aws : .aws 경로로 이동
vim credentials : credentials 만들기 (해당 모드에서
[default]
aws_access_key_id = ???
aws_secret_access_key = ???
값 넣어주고 esc -> :wq로 저장 후 나가기)
/home/ubuntu/rgProfect-react/lambda# 경로로 이동
> sudo npm i
> sudo claudia create --region ap-northeast-2 --handler index.handler
람다 설치가 끝나면 aws람다에서 package.json에 적어둔 명대로 올라가있다!
3. aws람다에서 트리거 및 설정
기본 설정을 10초로 늘려주고 메모리 설정도 256MB로 늘려줘야 리사이징을 하다 중간에 끊기는 일이 일어나지 않는다.
s3 파일이 생성되면 람다 실행하는 트리거 설정
s3 권한을 부여하기 위해 역할 확인 클릭 -> 정책 연결
s3의 모든 권한을 갖겠다 설정
4. 프론트에서 이미지 경로 리사이징된 thumb 경로로 변경
<div className={cx('food-thumbnail')}>
{
post.Images[0] !== undefined ? <img src={post.Images[0].src.replace(/original\//, 'thumb/')} />
:
!post.Images[0] !== undefined && post.categoryFood === '육류' ? <img src='/images/menu_ico1.jpg' alt=''/>
:
...
}
</div>