• cache가 없는 경우
  동일 요청 시 같은 데이터를 또 다운받는다
  용량 크면 비용도 커지고 브라우저 로딩 속도 느려진다
  
  
  

Web Cache

cache : 컴퓨터 과학에서 데이터나 값을 미리 복사하는 임시 장소

• 캐시에 데이터 미리 복사하면 접근시간 없이 빠른 속도로 접근 가능
• 네트워크 사용량 줄일 수 있음
• 브라우저의 빠른 로딩 속도
• 빠른 사용자 경험

캐시 유효시간 초과 경우

• 다시 서버에 요청하고 응답받음. 이때 다시 네트워크 다운로드 발생
• 새 캐시로 데이터 업데이트, 캐시 유효기간 다시 초기화됨
  
  
  

✅ 요약 정리

• 검증헤더

1. ETag: "v1.0", ETag:" 83832cdv98v9f8vf9fd"
2. Last-Modified: Wen, 26 Dec 2022 02:52:11 GMT

• 조건부 요청 헤더

1. If-Match, If-None-Match : ETag 값 사용
2. If-Modified-Since, If-UnModified-Since: Last-Modified 값 사용

Last Modified

검증 헤더

캐시를 제어할 수 있는 검증 헤더

• 캐시의 수정시간 알 수 있다
• 데이터의 마지막 수정시간 정보를 헤더에 포함
• 응답 검증헤더에 캐시에 저장할 때 데이터 최종 수정일 담김
  
  
  

If-Modified-Since

조건부 요청

캐시의 유효시간이 초과돼도 조건부 헤더를 이용해 조건부 요청 가능

• 서버의 최종 수정일과 비교해 데이터 수정여부 검증

• 데이터 미수정 시 응답 메시지에 Body 제외한 Header에 담아 전송

• 이때 HTTP Body는 응답에 없고,
  상태 코드는 304 Not Modified : 변경된 것이 없다는 뜻

• 응답 바디가 빠졌기 때문에 헤더만 포함된 0.1M만 전송됩니다.

• 클라이언트에서는 응답을 받은 후, 캐시를 갱신하고 다시 일정 유효시간(60초) 갱신

Last-Modified와 If-Modified-Since 단점

• 1초 미만 단위로 캐시 조정 불가능
• 날짜 기반 로직 사용
• 데이터 수정해서 날짜 다르지만, 같은 데이터를 수정해서 데이터 결과 똑같은 경우
• 서버에서 별도 캐시 로직을 관리하고 싶은 경우
  ex) 스페이스, 주석처럼 큰 영향없는 변경에서 캐시 유지하고 싶은 경우
  
  
  

ETag (Entity Tag), If-None-Match

Last-Modified와 If-Modified-Since보다 좀 더 간단한 방식

ETag : 서버에서 캐시를 완전히 제어하여 관리하는 검증헤더
If-None-Match : ETag값으로 조건부 요청

• 캐시용 데이터에 임의의 고유한 버전 이름 달아둠
• 데이터 변경 시 이름 바꿔서 변경 (Hash 재생성)
• 단순하게 ETag만 보내서 같으면 유지, 다르면 다시 받기

작동방식

• 서버에서 헤더에 ETag 작성하여 응답
• 클라이언트의 캐시에서 해당 ETag 값 저장
• 캐시 유효시간 초과해도 재요청하는 경우 ETag값 검증하는 If-None-Match를 요청 헤더에 작성하여 전송

---

Cache-Control

캐시 지시어

• Cache-Control: max-age
  캐시 유효 시간. 초 단위
• Cache-Control:no-cache
  데이터는 캐시가능하지만 항상 원 origin 서버에 검증하고 사용
• Cache-Control:no-store
  데이터에 민감한 정보 있으므로 저장하면 안됨
  메모리에서 사용하고 최대한 빨리 삭제

Expires

캐시 만료일 지정(하위 호환)

• Expires: Mon, 01 Jan 1990 00:00:00 GMT
• 캐시 만료일을 정확한 날짜로 지정
• HTTP 1.0 부터 사용
• 지금은 Cache-Contol:max-age 권장
• Cache-Control: max-age 같이 사용 시 Expires는 무시됨