1. CDN (Contents Delivery Network)

• 콘텐츠 전송 네트워크
• 지리적·물리적으로 떨어져 있는 사용자에게 콘텐츠를 더 빠르게 제공하는 시스템
• 사용자가 Origin Server로부터 콘텐츠(Web Object, Video, Image, Document 등)를 다운받을 때, 네트워크 지연으로 인해 응답 시간 증가
→ 사용자와 가까운 위치에 Cache Server를 두고 콘텐츠를 캐싱하여 요청시 Cache Server가 대신 응답
1-1. CDN의 장점
• 웹사이트 로딩 속도 개선
∙ 사용자와 가까운 서버에서 콘텐츠를 제공하여 응답 속도 향상
∙ Origin Server의 트래픽 부하 감소 및 비용 절감
• 인터넷 회선 비용 절감
∙ Origin Server로의 직접 트래픽 감소로 서버 및 네트워크 비용 감소
• 콘텐츠 제공 안정성 향상
∙ 인터넷 서비스 제공자(ISP)에 인접한 분산 서버를 통해 빠르고 안정적인 데이터 전송 가능
• 웹사이트 보안 강화
∙ 대규모 분산 서버 구조로 트래픽을 분산시켜 공격 트래픽 완화
1-2. CDN의 작동원리
• 최초 요청시 Oringin Server로부터 콘텐츠를 가져와 사용자에게 전송하며 동시에 CDN 캐싱 장비에 저장
• 이후 요청부터는 콘텐츠 만료 시점까지 CDN 캐싱 장비에 저장된 콘텐츠 전달
• 자주 요청되는 콘텐츠만 캐싱, 일정 기간 요청이 없을 경우 캐시에서 자동 제거
• 콘텐츠 조회 실패시 CDN 플랫폼 내 다른 서버를 통해 콘텐츠를 탐색하여 응답
• 콘텐츠가 없거나 오래된 경우, CDN은 Origin Server로 프록시 요청 수행, 새로운 콘텐츠를 저장하여 이후 요청에 대비
2. CloudFront

• AWS에서 제공하는 CDN 서비스
• 캐싱을 통해 사용자에게 더 빠른 콘텐츠 전송 속도를 제공
• 전 세계에 분산된 Edge Location을 기반으로, 사용자와 가장 가까운 Edge Server에서 콘텐츠를 제공
2-1. CloudFront 구성
• Origin Server
∙ 원본 데이터를 보유한 서버
∙ AWS 환경에서는 S3, EC2 Instance가 이에 해당
• Edge Server (Edge Location)
∙ AWS가 전 세계에 운영 중인 분산 서버
∙ 사용자 요청에 빠르게 응답하기 위한 캐싱 기능 제공
2-2. CloudFront 작동 방식
• 사용자가 콘텐츠 요청
• Edge Server에서 해당 콘텐츠의 캐싱 여부 확인
• 캐시가 존재하면 즉시 응답, 없을 경우 Origin Server로 요청 전달
• Origin Server로부터 전달받은 콘텐츠를 Edge Server에 캐싱한 후 사용자에게 응답
2-3. CloudFront로 제공 가능한 콘텐츠 유형
• Download Distribution
∙ HTTP 프로토콜을 통해 제공되는 이미지 및 일반적인 정적 파일
• Streaming Distribution
∙ HTTP Progressive Download 또는 RTSP(Real Time Streaming Protocol)를 지원하는 스트리밍 동영상 콘텐츠
2-4. Edge Server 캐시 특징
• 최초 요청 이후 콘텐츠는 Edge Server에 캐싱
• 기본 TTL(Time To Live)은 24시간, 사용자 설정에 따라 변경 가능
• TTL 반영 지연으로 인해 전체 TTL 수정 대신, 개별 객체에 대해 Invalidation API를 통해 캐시 삭제 가능
2-5. CloudFront의 활용도를 높여주는 주요 기능
• HTTPS 지원

∙ Oringin Serve가 HTTPS를 지원하지 않더라도 사용자와의 구간에서 HTTPS 통신 제공
∙ 사용자는 CLoudFront와 HTTPS 통신, CloudFront와 Origin Server간에 HTTP 통신
• 특정 지역 콘텐츠 접근 제한
∙ 지리적 제한(Geo Restriction) 기능 제공
∙ 비즈니스 정책에 따라 특정 국가에서의 콘텐츠 접근을 제한 가능
∙ 보안 이슈 대응 차원에서 특정 지역의 접근 차단 구성 가능
• Signed URL

∙ S3의 Pre-signed URL과 유사한 Signed URL 기능 제공
∙ 허용된 사용자에게만 특정 콘텐츠 접근을 허용할 수 있음, 단일 콘텐츠 단위 제어
∙ ex) 유료 결제 사용자만 스트리밍 가능한 영상, 특정 조건의 사용자에게만 제공되는 콘텐츠
∙ 프로세스
1. 콘텐츠 접근이 허용된 사용자를 정의
2. 특정 콘텐츠에 대한 Signed URL 생성
3. 사용자가 콘텐츠 요청
4. 사용자 검증 수행
5. 검증 성공시 Signed URL 제공
6. 사용자는 Signed URL을 통해 콘텐츠 접근
• Signed Cookie
∙ 다수의 콘텐츠에 대한 접근 제어가 필요한 경우 사용
∙ ex) 로그인한 유료 회원에게 전체 유료 콘텐츠를 제공하는 시나리오
∙ 프로세스
1. CloudFront URL 검증에 사용될 공개 키를 포함한 신뢰할 수 있는 키 그룹 지정
2. 애플리케이션에서 사용자에게 세 가지 Set-Cookie 헤더 전달 (CloudFront-Policy, CloudFront-signature,
CloudFront-Key-Pair-Id)
3. 사용자가 로그인하여 접근 자격 충족
4. 애플리케이션은 Set-Cookie 헤더를 반환, 사용자는 저장
5. 콘텐츠 요청 시 Cookie에 name-value pair를 포함
6. CloudFront는 공개 키를 사용해 Signed Cookie 검증
7. Cookie가 유효하면 설정된 Policy 확인
8. Edge Server 캐시 여부 확인 후 콘텐츠 제공 (없을 경우 Origin Server)
F/E 실무에 체감되는 CloudFront 장점
• 정적 자산 로딩 체감 속도
∙ Image, Font, JS Bundle 등 Static Resource를 CloudFront로 분리하면 첫 진입 로딩 체감 속도 개선
∙ LightHouse, Web Vitals 지표에서 LCP / TTFB 개선 효과
• 빌드 결과물 캐싱 편리
∙ /static/*.js, /assets/*.png 같은 해시 기반 파일명을 CloudFront에 캐싱시 브라우저 캐시 + CDN 캐시 조합으로
재요청이 거의 발생하지 않음
• 배포 후 캐시 무효화 전략
∙ HTML은 짧은 TTL, 정적 자산은 긴 TTL
∙ 문제가 생기면 Invalidation API로 특정 파일만 즉시 제거
⭐발표자 : 이현주님
1. CDN (Contents Delivery Network)
• 콘텐츠 전송 네트워크
• 지리적·물리적으로 떨어져 있는 사용자에게 콘텐츠를 더 빠르게 제공하는 시스템
• 사용자가 Origin Server로부터 콘텐츠(Web Object, Video, Image, Document 등)를 다운받을 때, 네트워크 지연으로 인해 응답 시간 증가
→ 사용자와 가까운 위치에 Cache Server를 두고 콘텐츠를 캐싱하여 요청시 Cache Server가 대신 응답
1-1. CDN의 장점
• 웹사이트 로딩 속도 개선
∙ 사용자와 가까운 서버에서 콘텐츠를 제공하여 응답 속도 향상
∙ Origin Server의 트래픽 부하 감소 및 비용 절감
• 인터넷 회선 비용 절감
∙ Origin Server로의 직접 트래픽 감소로 서버 및 네트워크 비용 감소
• 콘텐츠 제공 안정성 향상
∙ 인터넷 서비스 제공자(ISP)에 인접한 분산 서버를 통해 빠르고 안정적인 데이터 전송 가능
• 웹사이트 보안 강화
∙ 대규모 분산 서버 구조로 트래픽을 분산시켜 공격 트래픽 완화
1-2. CDN의 작동원리
• 최초 요청시 Oringin Server로부터 콘텐츠를 가져와 사용자에게 전송하며 동시에 CDN 캐싱 장비에 저장
• 이후 요청부터는 콘텐츠 만료 시점까지 CDN 캐싱 장비에 저장된 콘텐츠 전달
• 자주 요청되는 콘텐츠만 캐싱, 일정 기간 요청이 없을 경우 캐시에서 자동 제거
• 콘텐츠 조회 실패시 CDN 플랫폼 내 다른 서버를 통해 콘텐츠를 탐색하여 응답
• 콘텐츠가 없거나 오래된 경우, CDN은 Origin Server로 프록시 요청 수행, 새로운 콘텐츠를 저장하여 이후 요청에 대비
2. CloudFront
• AWS에서 제공하는 CDN 서비스
• 캐싱을 통해 사용자에게 더 빠른 콘텐츠 전송 속도를 제공
• 전 세계에 분산된 Edge Location을 기반으로, 사용자와 가장 가까운 Edge Server에서 콘텐츠를 제공
2-1. CloudFront 구성
• Origin Server
∙ 원본 데이터를 보유한 서버
∙ AWS 환경에서는 S3, EC2 Instance가 이에 해당
• Edge Server (Edge Location)
∙ AWS가 전 세계에 운영 중인 분산 서버
∙ 사용자 요청에 빠르게 응답하기 위한 캐싱 기능 제공
2-2. CloudFront 작동 방식
• 사용자가 콘텐츠 요청
• Edge Server에서 해당 콘텐츠의 캐싱 여부 확인
• 캐시가 존재하면 즉시 응답, 없을 경우 Origin Server로 요청 전달
• Origin Server로부터 전달받은 콘텐츠를 Edge Server에 캐싱한 후 사용자에게 응답
2-3. CloudFront로 제공 가능한 콘텐츠 유형
• Download Distribution
∙ HTTP 프로토콜을 통해 제공되는 이미지 및 일반적인 정적 파일
• Streaming Distribution
∙ HTTP Progressive Download 또는 RTSP(Real Time Streaming Protocol)를 지원하는 스트리밍 동영상 콘텐츠
2-4. Edge Server 캐시 특징
• 최초 요청 이후 콘텐츠는 Edge Server에 캐싱
• 기본 TTL(Time To Live)은 24시간, 사용자 설정에 따라 변경 가능
• TTL 반영 지연으로 인해 전체 TTL 수정 대신, 개별 객체에 대해 Invalidation API를 통해 캐시 삭제 가능
2-5. CloudFront의 활용도를 높여주는 주요 기능
• HTTPS 지원
∙ Oringin Serve가 HTTPS를 지원하지 않더라도 사용자와의 구간에서 HTTPS 통신 제공
∙ 사용자는 CLoudFront와 HTTPS 통신, CloudFront와 Origin Server간에 HTTP 통신
• 특정 지역 콘텐츠 접근 제한
∙ 지리적 제한(Geo Restriction) 기능 제공
∙ 비즈니스 정책에 따라 특정 국가에서의 콘텐츠 접근을 제한 가능
∙ 보안 이슈 대응 차원에서 특정 지역의 접근 차단 구성 가능
• Signed URL
∙ S3의 Pre-signed URL과 유사한 Signed URL 기능 제공
∙ 허용된 사용자에게만 특정 콘텐츠 접근을 허용할 수 있음, 단일 콘텐츠 단위 제어
∙ ex) 유료 결제 사용자만 스트리밍 가능한 영상, 특정 조건의 사용자에게만 제공되는 콘텐츠
∙ 프로세스
1. 콘텐츠 접근이 허용된 사용자를 정의
2. 특정 콘텐츠에 대한 Signed URL 생성
3. 사용자가 콘텐츠 요청
4. 사용자 검증 수행
5. 검증 성공시 Signed URL 제공
6. 사용자는 Signed URL을 통해 콘텐츠 접근
• Signed Cookie
∙ 다수의 콘텐츠에 대한 접근 제어가 필요한 경우 사용
∙ ex) 로그인한 유료 회원에게 전체 유료 콘텐츠를 제공하는 시나리오
∙ 프로세스
1. CloudFront URL 검증에 사용될 공개 키를 포함한 신뢰할 수 있는 키 그룹 지정
2. 애플리케이션에서 사용자에게 세 가지 Set-Cookie 헤더 전달 (CloudFront-Policy, CloudFront-signature,
CloudFront-Key-Pair-Id)
3. 사용자가 로그인하여 접근 자격 충족
4. 애플리케이션은 Set-Cookie 헤더를 반환, 사용자는 저장
5. 콘텐츠 요청 시 Cookie에 name-value pair를 포함
6. CloudFront는 공개 키를 사용해 Signed Cookie 검증
7. Cookie가 유효하면 설정된 Policy 확인
8. Edge Server 캐시 여부 확인 후 콘텐츠 제공 (없을 경우 Origin Server)
F/E 실무에 체감되는 CloudFront 장점
• 정적 자산 로딩 체감 속도
∙ Image, Font, JS Bundle 등 Static Resource를 CloudFront로 분리하면 첫 진입 로딩 체감 속도 개선
∙ LightHouse, Web Vitals 지표에서 LCP / TTFB 개선 효과
• 빌드 결과물 캐싱 편리
∙ /static/*.js, /assets/*.png 같은 해시 기반 파일명을 CloudFront에 캐싱시 브라우저 캐시 + CDN 캐시 조합으로
재요청이 거의 발생하지 않음
• 배포 후 캐시 무효화 전략
∙ HTML은 짧은 TTL, 정적 자산은 긴 TTL
∙ 문제가 생기면 Invalidation API로 특정 파일만 즉시 제거
⭐발표자 : 이현주님