(HTTP) 헤더2 - 캐시와 조건부 요청

짜스의 하루 ·2024년 2월 28일

검증 헤더와 조건부 요청

  1. 캐시 시간 초과
    캐시 만료 후 클라이언트가 서버에 다시 요청을 할 때, 2가지 상황이 존재한다.

1) 서버에서 기존 데이터를 변경한 경우

  • 서버에서 변경된 데이터를 받음

2) 서버에서 기존 데이터를 변경하지 않은 경우

  • 데이터를 전송하는 대신 저장해두었던 캐시를 재사용할 수 O
    --> 단, 클라이언트의 데이터와 서버의 데이터가 같다는 사실을 확인할 방법 필요

검증 헤더 추가 - 첫번째 요청
1) Last-Modified(데이터가 마지막에 수정된 시간)을 설정해서 클라이언트에 데이터를 전송한다.

2) 클라이언트는 유효 시간과 데이터 최종 수정일을 함께 응답 결과를 캐시에 저장한다.

검증 헤더 추가 - 두번째 요청(캐시 시간 초과)
1) 클라이언트가 캐시 만료 후(60초 후) 요청을 보낸다.

2) 클라이언트는 헤더에 if-modified-since:데이터 최종 수정일을 붙여 서버에 요청을 보낸다.

3) 서버는 요청 받은 헤더의 if-modified-since 값과 데이터 최종 수정일을 비교하여 데이터가 바뀌었는지 검증한다.

4) 만약 캐시의 데이터 최종 수정일과 서버의 데이터 최종 수정일이 같다면(데이터의 변경이 발생하지 않았다면)

5) 서버는 데이터가 변경되지 않았다는 의미로 HTTP Body 없이, HTTP 헤더에 304 Not Modified를 전송한다.
--> HTTP Body 없이 HTTP Header 부분만 전송하기 때문에 부하X

6) 클라이언트는 서버로부터 304 Not Modified를 응답받았으므로 캐시 데이터(응답 결과)를 재사용하고 헤더 데이터를 갱신한다.

7) 클라이언트는 캐시에서 데이터를 조회하여 사용한다.
업로드중..

검증 헤더와 조건부 요청 정리

1) 서버

  • 캐시가 만료되도 서버의 데이터가 변경되지 않았으면, 서버는 304 Not Modified + 헤더 메타 정보만 응답(HTTP bodyX)

2) 클라이언트

  • 클라이언트는 서버가 보낸 응답 헤더 정보로 캐시의 메타 정보를 갱신(캐시 유효 기간도 갱신)
  • 클라이언트는 캐시에 저장된 데이터 재활용
    -> 네트워크 다운로드가 발생하지만 용량이 적은 헤더 정보만 다운로드하기 때문에, 매우 실용적

<흐름 정리>
1. 클라이언트가 서버에 데이터를 최초 요청한다.
2. 서버는 cache-control, last-modified를 헤더에 붙여 캐시의 유효 기간, 데이터 최종 수정일을 설정하여 응답을 보낸다.
3. 브라우저 캐시에 유효 기간과 데이터 최종 수정일과 함께 응답 결과를 저장한다.
4. 클라이언트가 캐시의 유효기간이 만료된 데이터를 요청하면, 요청 헤더의 if-modified-since에 last-moidifed(데이터 최종 수정일)값을 설정하여 서버에 요청을 보낸다.
5. 서버는 if-modified-since 값과 데이터의 최종 수정일을 비교하여 데이터 변경이 있는지 검증한다.
6. 데이터 변경이 없었다면, 서버는 헤더 메타 정보, 304 Not Modified 를 붙여 응답을 보낸다. (HTTP 바디X)
7. 클라이언트가 304 응답을 받으면, 캐시의 메타 정보(캐시 유효기간 등)을 갱신하고, 캐시에 저장된 데이터를 조회하여 사용한다.

검증 헤더와 조건부 요청2

검증 헤더

  • 캐시 데이터와 서버 데이터가 같은지 검증하는 데이터
  • Last-Modified, ETag

조건부 요청 헤더

  • 검증 헤더로 조건에 따른 분기
  • If-Modified-Since: Last-Modified 사용
  • If-None-Math: ETag 사용
  • 조건이 만족하면 200 OK
  • 조건이 만족하지 않으면 304 Not Modified

<예시>
If-Modified-Since: 이후에 데이터가 수정되었으면?
<데이터 미변경 예시>

  • 캐시: 2020년 11월 10일 10:00:00 vs 서버: 2020년 11월 10일 10:00:00
  • 304 Not Modified, 헤더 데이터만 전송(Body 미포함)
  • 전송 용량 0.1M (헤더 0.1M, 바디 1.0M)

<데이터 변경 예시>

  • 캐시: 2020년 11월 10일 10:00:00 vs 서버: 2020년 11월 10일 11:00:00
  • 200 OK, 모든 데이터 전송(Body 포함)
  • 전송 용량 1.1M (헤더 0.1M, 바디 1.0M)
    검증 헤더와 조건부 요청
    Last-Modified, If-Modified-Since 단점

ETag, If-None-Match

  • ETag(Entity Tag)
  • 캐시용 데이터에 임의의 고유한 버전 이름을 달아둠
    예) ETag: "v1.0", ETag: "aafadsfasd"
  • 데이터가 변경되면 이 이름을 바꾸어서 변경함(Hash를 다시 생성)
    예) ETag: "aaaaa" -> ETag: "bbbbb"
    진짜 단순하게 ETag만 보내서 같으면 유지, 다르면 다시 받기!

ETag, If-None-Match 정리

  • 진짜 단순하게 ETag만 서버에 보내서 같으면 유지, 다르면 다시 받기!
  • 캐시 제어 로직을 서버에서 완전히 관리
  • 클라이언트는 단순히 이 값을 서버에 제공( 클라이언트는 캐시 매커니즘을 모름)
    예)
  • 서버는 베타 오픈 기간인 3일 동안 파일이 변경되어도 ETag를 동일하게 유지
  • 애플리케이션 배포 주기에 맞추어 ETag 모두 갱신
profile
2024. 01. 02 ~ 백앤드 공부 시작, 2024. 04.01 ~ 프론트 공부 시작

0개의 댓글