람다 엣지를 통한 CDN Serverless 컴퓨팅

1. 5
Amazon CloudFront Day 2018
Lambda@Edge로 똑똑한 CDN 서비스하기
GS네오텍과 Amazon이 함께하는

2. 1. 왜!? Lambda@Edge를 사용해야 하지?
2. Lambda@Edge의 구조
3. Lambda@Edge를 활용한 예제
CONTENTS

3. 왜!? Lambda@Edge를 사용해야 하지?

4. CDN을 사용하는 이유01 |
Content Delivery Network(CDN)
• 사용자가 원본(Origin) 서버의 컨텐츠를 접근할 시
Latency를 줄이기 위해 사용
• 컨텐츠 제공자는 Edge Location에 컨텐츠를 저장하고
사용자는 가장 가까운 Edge에서 컨텐츠를 받음
• 거리에 대한 제약 조건을 해소하기 위한 방안

5. CDN을 사용하는 이유01 |
Content Caching
• 최초 사용자가 컨텐츠를 요청할 시 원본(Origin)에서
컨텐츠를 가져와 Edge에 저장하고, 다음 사용자에게는
Edge에 저장된 컨텐츠를 제공한다.
• Edge에 저장된 컨텐츠는 TTL 값을 가지며 TTL이 만료되면
Edge의 컨텐츠를 무시하고 원본에 다시 확인한다.
• 원본 서버의 부하를 줄이기 위한 용도
1
2 3
4
5
6 7
8
9
10 11
12
TTL 만료

6. CDN을 사용하는 이유01 |
Cost Optimized
• CloudFront와 EC2/S3간 데이터 통신비용은 무료이며,
CloudFront의 Outbound Traffic이 많을 시 별도 계약 가능
• GS네오텍은 많은 CloudFront 고객을 보유하고 있으며,
AWS와 CF 트래픽 비용을 계약하여 고객에게 제공
• 결과적으로 GS네오텍과 계약(과금 통합)을 한 후,
CF를 사용하게 되면 Outbound Traffic 비용 최적화 가능
$$$$$
$ $ $ $ $ $ $ $ $ $

7. 그렇다면 Lambda@Edge는?01 |
WAS를 더 효율적으로!!
• CDN을 사용하는 두 번째의 요구사항을 극대화하여
WAS에서 실행해야 하는 단순한 컴퓨팅 로직을
Lambda@edge에 맡기자!
• 사용자가 가장 먼저 접근하는 CF를 똑똑하게 만들어
좀 더 다양한 기능을 사용자에게 제공하자!
• 갑작스러운 트래픽에 대비하기 위하여 불필요한 자원을
미리 정의하지 않고 쓴 만큼 과금하여 과금 최적화를 하자!

8. Lambda@Edge의 구조

9. Lambda@Edge의 정의02 |
https://aws.amazon.com/ko/lambda/edge/

10. Lambda@Edge의 정의02 |
https://aws.amazon.com/ko/lambda/edge/

11. Lambda@Edge의 새로운 기능02 |
• Functions 용량을 최대 1536 MB 까지 지원한다.
• Response 용량을 최대 1 MB 까지 지원한다.
• Packages 용량을 최대 50 MB 까지 지원한다.
• Timeout을 최대 30초 까지 지원한다.
• 모든 Event에서 External Network Call을 생성할 수 있다.

12. Lambda@Edge 동작 방법02 |
CloudFront
cache
Viewer Request
Viewer Response
Origin Request
Origin Response
User Agents HTTP Origins

13. Viewer Request 이벤트02 |
CloudFront
cache
Viewer Request
Viewer Response
Origin Request
Origin Response
User Agents HTTP Origins

14. Viewer Request 이벤트02 |
• CloudFront에 Cache된 컨텐츠에 접근하기 전에 실행 됨
• Cache key 변경 (URL, cookies, headers, query string)
• A/B 테스트
• 인증(Authentication)과 권한(Authorization) 확인
• 최종 사용자에게 응답을 반환하고 이를 Caching하지 않는다.

15. Viewer Request 이벤트 – QueryString 정규화02 |
CloudFront distribution
www.example.com
사용자A
사용자B
사용자C
/index.js?querystrig
Viewer Request
/index.js?queryStrig
/index.js?querystrig
/index.js?QUERYStrig
/index.js?querystrig
Cached response

16. Viewer Request 이벤트 – A/B테스트02 |
CloudFront distribution
www.example.com사용자
Viewer Request Event
A HTTP Origin
B HTTP Origin

17. Viewer Request 이벤트 – Stateless Auth02 |
User Agents
사용자 인증정보
Identity Provider(IdP)
JSON Web Token
(JWT)
JWT
CloudFront distribution
www.example.com
Viewer Request
JWT Public Key
JWT
Access Decision
NO
HTTP 403, 3xx, etc.
OK
Origin Application
Legacy Application
S3 bucket

18. Origin Request 이벤트02 |
CloudFront
cache
Viewer Request
Viewer Response
Origin Request
Origin Response
User Agents HTTP Origins

19. Origin Request 이벤트02 |
• CloudFront에서 Cache miss가 실행 되어 Origin에 접근하기 전에 실행 됨
• 인증과 권한을 기반으로 Origin 접근 통제
• 복잡한 Origin URL을 좀 더 간편한 URL로 변경
• Request header값을 기준으로 원본을 동적으로 선택
• 최종 사용자에게 function에서 직접 응답을 반환하고 이를 Caching하지 않는다.

20. Origin Request 이벤트 – 지역 기준 라우팅02 |
User Agents CloudFront distribution
www.example.com
Cache Behavior
/app
Origin Request
Event
Cache Behavior
/login North America
Region
User DB
North America DB
Europe Region Europe DB
home-region=eu?
APAC Region APAC DB

21. Origin Request 이벤트 – 장치 기준 라우팅02 |
Desktop
Mobile
Bot and
Crawlers
CloudFront distribution
www.example.com
Origin Request
Event
Mobile App
Desktop App
Other App
CloudFront-Is-Desktop-Viewer?
CloudFront-Is-Mobile-Viewer?
CloudFront-Is-Tablet-Viewer?
User-Agent?

22. CloudFront
cache
Viewer Request
Viewer Response
Origin Request
Origin Response
User Agents HTTP Origins
Origin Request 이벤트 – 직접 응답02 |

23. Origin Request 이벤트 – 직접 응답02 |
CloudFront
cache
Viewer Request
Viewer Response
Origin Request
Origin Response
User Agents HTTP Origins

24. Origin Response 이벤트02 |
CloudFront
cache
Viewer Request
Viewer Response
Origin Request
Origin Response
User Agents HTTP Origins

25. Origin Response 이벤트02 |
• CloudFront에서 Cache miss가 실행 되어 Origin에서 응답한 후에 실행 됨
• Edge에서 컨텐츠를 Caching하기 전에 Response Header를 수정할 수 있다.
• Origin에서 오류 상태코드(4xx, 5xx)를 반환할 때 상태코드 변경(2xx, 3xx) 가능
• 실행되지 않는 경우
• Origin Request 이벤트가 트리거한 함수로부터 응답이 생성되는 경우

26. Origin Response 이벤트 – Origin 응답 오류 시 Redirect02 |
CloudFront distribution
www.example.com
사용자들
HTTP Origin
Origin Response
Event302 Redirect
Temp Site
Temp Site
Cache Behavior
/app

27. Origin Response 이벤트 – 실행되지 않는 경우02 |
CloudFront
cache
Viewer Request
Viewer Response
Origin Request
Origin Response
User Agents HTTP Origins

28. Viewer Response 이벤트02 |
CloudFront
cache
Viewer Request
Viewer Response
Origin Request
Origin Response
User Agents HTTP Origins

29. Viewer Response 이벤트02 |
• Origin 또는 Cache된 모든 요청의 응답 시 실행
• Caching 결과 값과 상관 없이 Response header를 변경할 수 있다.
• 실행되지 않는 경우
• 오리진이 400 이상의 HTTP 상태 코드 반환하는 경우
• 사용자 지정 오류 페이지가 반환될 때
• 최종 사용자 요청 이벤트가 트리거한 함수로부터 응답이 생성되는 경우
• CloudFront가 자동으로 HTTP 요청을 HTTPS로 리디렉션하는 경우
(Viewer Protocol Policy 값이 [Redirect HTTP to HTTPS]일 경우)

30. Lambda@Edge를 활용한 예제

31. 동적 웹 페이지 처리03 |
CloudFront distribution
www.example.com
Cache Behavior
/blog
Amazon
DynamoDB table
blog-posts
Origin Request Event
External Network Calls
S3 Bucket
blog-template.s3.amazonaws.com
Rendered TemplateCached response
사용자

32. Dynamic resizing03 |
https://blog.wisen.co.kr/?p=7258
CloudFront distribution
www.example.com
/image.jpg?d=100x100
→ /100x100/webp/image.jpg
Viewer Request
Cache Behavior
/*.jpg, /*.png
S3 Origin
Resize
/image.jpg
Save
/100x100/webp/image.jpg
200
404
Origin Response
사용자
Image ResponseCached response

33. 참고자료** |
• Lambda@Edge Documentation
https://docs.aws.amazon.com/ko_kr/AmazonCloudFront/latest/DeveloperGuide/
lambda-at-the-edge.html
• AWS re:Invent 2017: Taking Serverless to the Edge (SRV312)
https://www.youtube.com/watch?v=3iknsVpfYr0
• WiseN Blog
https://blog.wisen.co.kr/?p=7258