Part 02. CloudFront 캐싱 정책 완벽 가이드

Cloud Architect/Root Cause Analysis

Part 02. CloudFront 캐싱 정책 완벽 가이드

"Everything about infra" 2026. 1. 27. 02:21

안녕하세요!

이커머스 웹사이트 운영 중 겪은 AWS CloudFront 캐싱 정책

변경 장애 사례와 해결 방법을 정리해봤습니다.

01. 실제 장애 사례

✅ 장애 발생 배경

초기 상황
1. 일 방문자 약 5,000명 규모의 이커머스 운영 중
2. 모바일 트래픽 70%
발단
1. 업데이트 된 파일을 운영계에 배포.
2. 하지만 웹 사이트에 반영이 안되는 현상
3. Cache 때문이라고 판단됨.
4. 해당 파일의 경로에 대해 캐시 초기화 (무효화) 진행
5. 여전히 반영이 되지 않았음

✅ 시도한 해결책

1차 시도

CloudFront 이미지(jpg, jpeg, png ..)경로의 캐시 정책 변경

기존 : 기본 TTL 1일, 최대 TTL 1년
변경 : 기본, 최대 TTL 10분
목적 : 빠르게 업데이트 반영

추가 조치

default 경로에 User-Agent 헤더 추가
Cache Policy에 CloudFront-Is-Mobile-Viewer 포함

결과 : ❌ 실패

업데이트 된 파일이 여전히 반영 안됨.
모바일 이미지 사이즈 미스매치 (레이아웃 꺠짐)
관리자 페이지 로그인 불가
일부 카테고리 접근 불가

2차 시도

CloudFront 동작 default 경로에 대한 쿠키 설정 변경

Cookie를 "모두" 포함 시켰음.
목적 : 세션 인식 문제 해결

결과: ⚠️ 부분 성공

관리자 페이지 로그인 가능 (접근 가능)
모바일 이미지 여전히 문제
일부 카테고리 접근 여전히 불가.

3차 시도 : 원상 복구

모든 설정 원상 복구
TTL 10분 → TTL 1일
Cache Policy → Legacy cache settings

이커머스 사이트 이다 보니 고객 서비스에 문제가 직결되므로 빠른 복구
복구 이후 CloudFront Logs 및 Web Server Logs 파악

1-1. 로그 분석

📌 CloudFront 로그 분석

변경 전 (기존 TTL 1일, 최대 TTL 1년)

이미지:
Hit: 11,010건
Miss: 1,481건
RefreshHit: 1,588건
히트율: 89.48% ✓

동적 페이지:
Miss: 2,740건 (100%)
히트율: 0%
→ php/html은 캐시 안 함 (정상)

변경 후 (기존, 최대 TTL 10분)

이미지:
Hit: 11,216건
Miss: 1,216건
RefreshHit: 330건 (-79%!)
히트율: 90.47% (여전히 양호)

동적 페이지:
Miss: 4,155건 (100%)
히트율: 0%
→ 여전히 캐시 안 함

여기서 핵심은?

RefreshHit 79% 급감
하지만 이미지 히트율은 양호
동적 페이지(php 등..)은 원래 캐시 X
이미지 문제는 아닌 것으로 판단됨.

📌 Apache Error Logs 분석

[17:37:31] PHP Fatal Error: Cannot re-assign $this
[17:37:39] PHP Warning: Input variables exceeded 3000
[17:37:39] PHP Fatal Error: Cannot re-assign $this
[17:37:47] PHP Warning: Input variables exceeded 3000
[17:37:47] PHP Fatal Error: Cannot re-assign $this

→ 쿠키 처리 중 오류 (부차적 문제)

📌 근본적인 원인 파악

문제 핵심 : Legacy cache settings → Cache Policy 전환 시 누락된 것:

Legacy cache settings (기존):
✓ User-Agent를 자동으로 오리진에 전달
✓ 쿠키를 자동으로 전달
✓ 개발자가 신경 안 써도 됨

Cache Policy (변경 후):
✓ Cache Key에 CloudFront-Is-Mobile-Viewer 추가 (완료)
✓ Cache Key에 Cookie 추가 (완료)
❌ Origin Request Policy 설정 안 함!

휴먼 에러로 인해서 하기와 같은 결과를 초래하게 되었다.

User-Agent가 서버에 전달 안 됨
서버가 모바일/데스크톱 구분 못 함
기본값(데스크톱) 응답
모바일 사용자가 데스크톱 버전 받음

02. 올바른 설정 방법

✅ 필수 구성 요소

1) 정적 이미지용 Cache Policy:

TTL:
  Min: 3600
  Default: 14400
  Max: 86400
  
Cache Key Settings:
  Headers:
    - CloudFront-Is-Mobile-Viewer
    - Accept-Encoding
  
  Cookies:
    None
  
  Query Strings:
    All

2) 동적 페이지용 Cache Policy:

TTL:
  Min: 0
  Default: 300
  Max: 1800

Cache Key Settings:
  Headers:
    - CloudFront-Is-Mobile-Viewer
    - Accept-Encoding
  
  Cookies:
    All # (세션, 로그인 필요)
  
  Query Strings:
    All

3) Origin Request Policy:

Headers:
  - User-Agent (필수!)
  - CloudFront-Is-Mobile-Viewer
  - CloudFront-Is-Desktop-Viewer
  - CloudFront-Is-Tablet-Viewer
  - Referer
  - Accept-Language

Cookies:
  All

Query Strings:
  All

03. 검증 방법

Test 1) User-Agent 전달 확인

서버에 테스트 파일 생성 후 확인

<?php
// test_headers.php
header('Content-Type: text/plain');
echo "=== 받은 헤더 목록 ===\n\n";

echo "User-Agent: " . ($_SERVER['HTTP_USER_AGENT'] ?? '없음') . "\n";
echo "CloudFront-Is-Mobile-Viewer: " . ($_SERVER['HTTP_CLOUDFRONT_IS_MOBILE_VIEWER'] ?? '없음') . "\n";
echo "CloudFront-Is-Desktop-Viewer: " . ($_SERVER['HTTP_CLOUDFRONT_IS_DESKTOP_VIEWER'] ?? '없음') . "\n";
echo "Referer: " . ($_SERVER['HTTP_REFERER'] ?? '없음') . "\n";

echo "\n=== 쿠키 ===\n\n";
print_r($_COOKIE);
?>

테스트 진행:

# 모바일로 테스트
curl -H "User-Agent: iPhone" https://purinapetcare.co.kr/test_headers.php

# 기대 출력:
# User-Agent: iPhone
# CloudFront-Is-Mobile-Viewer: true
# CloudFront-Is-Desktop-Viewer: false

# 데스크톱으로 테스트
curl -H "User-Agent: Chrome" https://purinapetcare.co.kr/test_headers.php

# 기대 출력:
# User-Agent: Chrome
# CloudFront-Is-Mobile-Viewer: false
# CloudFront-Is-Desktop-Viewer: true

캐시 동작 확인:

# 첫 요청 (Cache Miss)
curl -I https://purinapetcare.co.kr/

# 응답 헤더 확인:
# X-Cache: Miss from cloudfront

# 두 번째 요청 (Cache Hit)
curl -I https://purinapetcare.co.kr/

# 응답 헤더 확인:
# X-Cache: Hit from cloudfront

모바일/데스크톱 구분 확인:

# 브라우저 개발자 도구 (F12)
# Network 탭에서 확인:

모바일 접속 → 모바일 레이아웃 ✓
데스크톱 접속 → 데스크톱 레이아웃 ✓

04. 체크리스트

📌 배포 전 체크리스트

□ Cache Policy 2개 생성 완료
□ 이미지용 (TTL 4시간)
□ 동적 페이지용 (TTL 5분)

□ Origin Request Policy 1개 생성 완료
□ User-Agent 포함 (필수!)
□ CloudFront-Is-*-Viewer 포함
□ 쿠키 All 설정

□ Behavior 설정 완료
□ 이미지 경로: Cache Policy만
□ Default 경로: Cache Policy + Origin Request Policy

□ 테스트 환경 검증
□ 스테이징에서 먼저 테스트
□ 모바일/데스크톱 둘 다 확인

□ 롤백 계획 수립
□ 5~10분 내 원복 가능한 절차

📌 배포 후 체크리스트

□ User-Agent 전달 확인
□ 테스트 파일로 확인
□ 서버 로그 확인

□ 캐시 동작 확인
□ X-Cache 헤더 확인
□ Hit/Miss 정상 동작

□ 비즈니스 검증
□ 모바일에서 접속
□ 데스크톱에서 접속
□ 관리자 로그인 확인
□ 주요 기능 정상 동작

□ 30분간 모니터링
□ 에러율 확인
□ 캐시 히트율 확인
□ 사용자 피드백 확인