해당 글은 인프런 김영한님의 영상을 보고 정리한 글입니다. 출처
캐시 기본 동작
캐시 적용 전
첫번째 요청 메시지 GET/star.jpg
두번째 요청 메시지 GET/star.jpg
첫번째 요청 메시지를 보내 서버에서 star.jpg를 다운받는다. 그 후 두번째 요청에서도 star.jpg를 다운받는다. 이럴 경우 네트워크를 매번 사용해야 하고 브라우저 로딩 속도가 느려지는 문제가 발생한다.
캐시 적용 후
첫번째 요청 메시지 GET/star.jpg
두번째 요청 메시지 GET/star.jpg
첫번째 요청 메시지를 보내서 서버로부터 star.jpg를 받고 이를 웹 브라우저의 브라우저 캐시에 저장한다.
그 후 두번째 요청 메시지를 보내기 전 브라우저 캐시에 있는 캐시의 유효시간이 아직 지나지 않는지 확인한다.(캐시 유효 시간 검증) 만약 캐시의 유효 시간이 지나지 않았다면 캐시에서 조회해서 브라우저에 뿌려준다. 캐시의 유효 시간이 지났다면 다시 서버에 요청을 한다.
캐시를 적용하면 네트워크 사용량을 줄이고 브라우저 로딩 속도를 빠르게 할 수 있다.
검증 헤더와 조건부 요청 헤더
검증 헤더(Validator)
ETag
Last-Modified
조건부 요청 헤더
If-Match,If-None-Match -> ETag 사용
If-Modified-Since,If-Unmodified-Since -> Last-Modified 사용
검증헤더와 조건부 요청1 (Last-Modified, If-Modified-Since)
캐시 유효 시간이 지났을 경우 웹브라우저는 서버에게 다시 요청을 하는데 응답으로 받은 데이터가 변경되지 않은 경우에는 서버에게서 다시 데이터를 굳이 응답받을 필요가 없다.
이럴경우 클라이언트의 데이터와 서버의 데이터가 같다는 사실을 확인할 수 있는 방법이 필요하다.
이 방법이 바로 검증헤더와 조건부 요청이다
웹브라우저 서버에게 첫번째 요청을 할 경우 응답 결과를 브라우저 캐시에 저장한다 이때 응답 메시지에서 Last-Modified의 값을 브라우저 캐시에 같이 저장한다.
캐시 유효 시간이 지난 후 다시 요청하려 할 때 캐시의 데이터 최종 수정일을 요청 헤더의 if-modified-since에 넣어준 후 서버에 요청한다.
서버에서 데이터가 변경되지 않았을 경우 -> 304 Not Modified, body에는 아무 것도 넣지 않은 상태로 응답 메시지를 보낸다.
서버에서 데이터가 변경되었을 경우 -> 200 OK , 모든 데이터 전송(body 포함)
서버에서 데이터가 변경되지 않았을 경우 -> 브라우저 캐시에 저장된 캐시의 유효시간을 다시 업데이트 해서 기존에 저장된 브라우저 캐시를 재사용한다.
검증헤더와 조건부 요청2 (ETag(Entity Tag), If-None-Match)
캐시용 데이터에 임의의 고유한 버전 이름(hash)을 달아놓고 ETag만 보내서 같으면 유지, 다르면 다시 받는다
last modified의 역할을 Etag 가 대신해주고, If-modified-since의 역할을 if-none-match가 대신해준다.
캐시의 시간이 초과되었을 경우에는 if-none-match에 etag를 넣어서 보내준다.
데이터의 변경이 없을 경우 응답으로 304 not modified와 etag를 보내준다
데이터의 변경이 있을 경우 응답으로 200 ok와 변경된 etag를 보내준다.
프록시 캐시
클라이언트와 원서버 사이에 존재한다.
클라이언트가 원서버에 요청 메시지를 보내면 프록시 캐시가 이를 확인해 클라이언트가 요청한 데이터가 있으면 프록시 캐시가 응답해준다.
클라이언트가 요청한 데이터가 없다면 원서버에게 요청 메시지를 보내 데이터를 받고 이를 클라이언트에게 보내준다.
캐시 제어 헤더
Cache-control
- Cache-control:max-age
캐시 유효 시간, 초단위 - Cache-control:no-cache
데이터는 캐시 가능, 원(origin)서버에서 검증을 반드시 거쳐야 함 - Cache-control:no-store
데이터에 민감한 정보가 있으니 저장하면 안됨 - Cache-control:public
응답이 public cache에 저장되어도 무방. - Cache-control:private
응답이 private cache에만 저장되어야 함(기본값)
아이디나 비밀번호와 같은 정보는 Cache-control:public인프록시 캐시에 저장되면 안됨.
응답이 클라이언트만을 위한 응답이다. - Cache-control:s-maxage
프록시 캐시에만 적용되는 max-age - Age:60
오리진 서버에서 응답 후 프록시 캐시 내에 머문 시간
Pragma
- Cache-control:no-cache 와 같은 역할, http1.0 이하 버전을 위해 사용
Expires
- 캐시 만료일을 날짜로 지정
- cache control:max-age와 함께 사용하면 무시됨.
캐시 무효화
확실하게 캐시 무효화하기 위해서는
Cache-Control:no-cache,no-store,must-revalidate + Pragma:no-cache 사용
no-cache vs must-revalidate
no-cache -> 데이터는 캐시해도 되지만, 항상 원서버에 검증하고 사용
- 원 서버 접근 실패시 오류 또는 200 OK(이전에 캐시된 데이터 사용)를 응답으로 내려줌
must-revalidate -> 캐시 만료후 최초 조회시 원 서버에 검증해야 함 - 원 서버 접근 실패시 반드시 오류 발생(504 Gateway Timeout)
-> no-cache로 설정시 원서버에서 응답으로 200 OK를 보낼 수도 있어 must-revalidate와 같이 사용해야 확실히 캐시 무효화가 된다.
