Clear-Site-Data

사용법

깨진 애셋을 배포하거나, 인증 토큰을 교체하거나, 사용자를 로그아웃시키는 상황에서는 모두 오래된 클라이언트 측 데이터를 없애야 합니다. 사용자에게 수동으로 캐시를 지우도록 안내하는 방법은 신뢰하기 어렵습니다. Clear-Site-Data 헤더는 단 한 번의 응답으로 특정 범주의 저장된 데이터를 제거하는 선언적 수단을 서버에 제공합니다.

이 헤더는 어떤 데이터 유형을 지울지 지정하는 하나 이상의 따옴표 문자열 디렉티브를 받습니다. 여러 디렉티브는 쉼표로 구분합니다. 와일드카드 ”*“는 향후 명세 개정으로 추가되는 데이터 유형까지 포함해 모든 것을 지웁니다.

이 헤더는 HTTPS에서만 동작합니다. 브라우저는 안전하지 않은 HTTP 응답에서는 이 헤더를 무시합니다. “cookies”의 범위는 등록된 도메인 전체와 모든 하위 도메인에 미칩니다. 즉 example.re에서 온 Clear-Site-Data 응답은 stage.example.re가 설정한 쿠키도 지웁니다.

흔한 배포 패턴은 이 헤더를 로그아웃 엔드포인트에 붙이는 것입니다. 서버는 로그아웃 요청에 Clear-Site-Data로 응답하여 세션 쿠키, 캐시된 리소스, 로컬 스토리지를 한 번에 지웁니다. 또 다른 패턴은 잘못된 배포 이후 일시적으로 제공하는 전용 캐시 무효화 URL로, 운영자가 캐시 만료를 기다리지 않고 방문자를 새 애셋으로 강제 전환할 수 있게 합니다.

참고

모든 응답에 Clear-Site-Data를 보내면 사실상 사이트의 캐싱이 비활성화됩니다. 페이지를 로드할 때마다 브라우저 캐시가 비워져 눈에 띄는 성능 저하가 발생합니다. 이 헤더는 로그아웃 엔드포인트, 오류 복구 페이지, 일시적인 캐시 무효화 URL처럼 목적이 분명한 응답에만 한정하십시오.

참고

주요 브라우저는 모두 Clear-Site-Data 헤더를 지원합니다. Safari는 “executionContexts”를 제외한 모든 디렉티브를 지원하며, 오리진 파티셔닝을 적용해 교차 사이트 iframe이 퍼스트파티 데이터를 지우지 못하게 합니다.

”cache”

해당 오리진에 대한 브라우저의 HTTP 캐시를 지웁니다. 일부 구현은 사전 렌더링된 페이지, 뒤로-앞으로 캐시 항목, 스크립트 캐시, WebGL 셰이더 캐시, 주소 표시줄 제안을 비롯한 관련 캐시도 함께 지웁니다.

”cookies”

등록된 도메인과 모든 하위 도메인의 쿠키를 전부 지웁니다. 해당 오리진과 연관된 HTTP 인증 자격 증명도 지웁니다. 쿠키 도메인 매칭이 상위 및 형제 하위 도메인을 포함하므로 범위가 다른 디렉티브보다 넓습니다.

”storage”

해당 오리진의 DOM 스토리지를 지웁니다. 여기에는 localStorage, sessionStorage, IndexedDB 데이터베이스, Service Worker 등록, Web SQL 데이터베이스(더 이상 사용되지 않음), FileSystem API 데이터, 플러그인 데이터가 포함됩니다.

”executionContexts”

해당 오리진의 모든 브라우징 컨텍스트를 다시 로드합니다. 브라우저는 그 오리진과 연관된 모든 열린 탭이나 프레임에서 location.reload()에 해당하는 동작을 수행합니다. 이 디렉티브는 실험적이며 널리 구현되어 있지 않습니다.

Chromium 전용 확장

“clientHints”, “prefetchCache”, “prerenderCache” 디렉티브는 W3C Clear Site Data 명세에 정의되지 않은 Chromium 전용 확장입니다. 명세에 정의된 디렉티브는 “cache”, “cookies”, “storage”, “executionContexts”, ”*“입니다. Chromium 확장은 Chromium 기반 브라우저에서만 동작하며 Firefox나 Safari는 이를 인식하지 않습니다.

”clientHints”

Accept-CH 헤더로 설정된 저장된 클라이언트 힌트 설정을 지웁니다. Chromium 전용 확장입니다. “cache”, “cookies”, ”*“를 지우면 클라이언트 힌트도 자동으로 지워집니다.

”prefetchCache”

리퍼러 오리진으로 범위가 지정된 Speculation Rules 프리페치 캐시를 지웁니다. Chromium 전용 확장입니다. 로그인이나 로그아웃 같은 상태 변경 이후 오래된 프리페치 콘텐츠를 버리는 데 유용합니다. 이 디렉티브를 담은 헤더는 동일 사이트의 어떤 HTTP 응답에서도 동작합니다.

”prerenderCache”

리퍼러 오리진으로 범위가 지정된 Speculation Rules 프리렌더 캐시를 지웁니다. Chromium 전용 확장입니다. “prefetchCache”와 짝지어 모든 추측 로딩 캐시를 지웁니다. JavaScript로 데이터를 가져오는 클라이언트 측 렌더링 애플리케이션은 상태가 바뀔 때 “prerenderCache”를 사용해, 프리페치된 HTML은 그대로 두고 프리렌더된 페이지만 버립니다.

”*” (와일드카드)

명세에 추가될 향후 디렉티브 유형까지 포함해 해당 오리진의 모든 데이터 유형을 지웁니다. 전면 정리를 위한 가장 안전한 선택지이며, 브라우징 경험에 가장 넓은 영향을 미칩니다.

예시

로그아웃 엔드포인트가 세션 쿠키와 스토리지를 지웁니다. 브라우저는 해당 도메인(하위 도메인 포함)의 모든 쿠키를 비우고, localStorage와 IndexedDB 데이터를 제거하며, 캐시된 리소스를 버립니다.

Clear-Site-Data: "cache", "cookies", "storage"

잘못된 배포 이후 캐시만 겨냥해 지웁니다. 서버는 방문자들이 새 애셋으로 모두 넘어갈 때까지 이 헤더를 응답에 일시적으로 붙입니다.

Clear-Site-Data: "cache"

와일드카드를 사용한 전면 정리입니다. 모든 캐시 데이터, 쿠키, 스토리지, 향후의 데이터 유형이 제거됩니다. 계정 삭제 확인 페이지에서 흔히 쓰입니다.

Clear-Site-Data: "*"

상태 변경 이후 추측 로딩 캐시만 지웁니다. 로그인 이벤트 이전에 프리페치·프리렌더된 페이지가 버려집니다.

Clear-Site-Data: "prefetchCache", "prerenderCache"