캐시가 꼬일 때 확인하는 순서

캐시 문제는 재현하기 어렵다. 로컬에선 잘 보이다가 배포 환경에서 갑자기 깨진다. 캐시를 지우면 정상 동작하지만, 다시 캐시가 쌓이면 또 깨진다.

먼저 캐시 레이어 확인하기

캐시는 여러 단계에 있다.

• 브라우저 캐시 (HTTP 헤더)
• CDN 캐시 (Cloudflare, Vercel 등)
• 애플리케이션 캐시 (Redis, in-memory)
• 데이터베이스 쿼리 캐시

어느 단계에서 문제가 나는지 알아야 한다. 브라우저 캐시라면 Ctrl+Shift+Delete로 지워본다. CDN 캐시라면 CDN 패널에서 무효화한다. 애플리케이션 캐시라면 Redis CLI에서 직접 본다.

# HTTP 캐시 헤더 확인
curl -i https://example.com/page

# 응답 헤더에서 Cache-Control, ETag, Last-Modified 확인

캐시 키 확인하기

캐시 키가 예상과 다를 수 있다. 예를 들어 URL 파라미터 순서가 다르면 같은 내용이라도 다른 캐시 항목이 된다.

// 나쁜 예: URL 파라미터가 일정하지 않다
fetch(`/api/user?role=admin&id=1`); // 캐시 키: role=admin&id=1
fetch(`/api/user?id=1&role=admin`); // 캐시 키: id=1&role=admin (다른 캐시)

// 낫다: 파라미터를 정렬한다
const params = new URLSearchParams({ role: 'admin', id: '1' });
fetch(`/api/user?${params.toString()}`);

캐시 만료 시간 확인

캐시가 너무 길면 오래된 데이터를 본다. 너무 짧으면 캐시 의미가 없다. 데이터 종류에 따라 다르다.

• 사용자 프로필: 5분
• 블로그 글 목록: 1시간
• 정적 파일: 1년
• 실시간 데이터: 캐시 안 함

// 응답 헤더 설정 (Next.js 예)
export const revalidate = 3600; // 1시간

캐시 무효화 확인

데이터를 수정했을 때 캐시를 같이 지워야 한다. 포스트를 수정했으면 포스트 목록 캐시도 같이 지운다.

// 데이터 수정 후 캐시 무효화
await updatePost(id, data);

// 관련된 모든 캐시 키 지우기
redis.del(`post:${id}`);
redis.del('posts:list'); // 목록도 다시 로드해야 한다

배포 후 캐시 일괄 지우기

코드를 배포했는데 캐시가 문제면, 모든 캐시를 지우고 새로 쌓도록 한다.

# Redis 전체 캐시 삭제 (주의!)
redis-cli FLUSHDB

# CDN 캐시 무효화
# Vercel: vercel env pull && vercel deploy --prod
# Cloudflare: API 호출 또는 대시보드에서 "Purge Cache"

최종 확인: 실제 사용자 경로

캐시를 지웠다고 해서 끝이 아니다. 실제로 브라우저에서 데이터가 새로 로드되는지 확인한다. 개발자 도구 Network 탭에서 응답 헤더를 본다.

marginTop마지막으로, 캐시 문제는 한두 번 겪으면 나중에 훨씬 빠르게 진단할 수 있다. "캐시일 거야"라는 감으로 제일 먼저 확인하는 습관을 들이면 된다.