![[모든 개발자를 위한 HTTP 웹 기본 지식] 8. HTTP 헤더 2 : 캐시와 조건부 요청](https://img1.daumcdn.net/thumb/R750x0/?scode=mtistory2&fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2FbphYCj%2FbtsDNtbVmSh%2FFlQ79fQC2XgAFVgKusd3e1%2Fimg.png)
인프런 김영한 강사님의 [모든 개발자를 위한 HTTP 웹 기본 지식] 을 수강하고 정리한 글입니다.
모든 개발자를 위한 HTTP 웹 기본 지식 강의 - 인프런
실무에 꼭 필요한 HTTP 핵심 기능과 올바른 HTTP API 설계 방법을 학습합니다., [사진] 📣 확인해주세요!본 강의는 자바 스프링 완전 정복 시리즈의 세 번째 강의입니다. 우아한형제들 최연소 기술
www.inflearn.com
📌 캐시 기본 동작
✅ 캐시가 없을 때 HTTP 통신
캐시가 없다면 매 HTTP 통신 마다 같은 일이 일어난다.
데이터가 변경되지 않더라도 계속해서 인터넷 네트워크를 통해 같은 데이터를 다운로드 받아야하고, 이는 낭비가 크다.
이때문에 브라우저 로딩 속도가 느려지고, 느린 사용자 경험으로 이어진다.
✅ 캐시를 적용한 HTTP 통신
요청 헤더에 cache-control과 max-age 옵션을 붙힌다. 이렇게 되면, 서버에서 캐시에 저장한다.
그리고 60초 내에 한번 더 같은 것을 요청한다면,
이러한 캐시 덕분에 캐시의 유효시간동안 네트워크를 사용하지 않아도 되어 브라우저 로딩 속도가 매우 빨라진다.
이는 빠른 사용자 경험으로 이어진다.
그런데 문제는 이 캐시의 유효시간이 지나면 다시 캐시에 저장해야 하므로, 인터넷 네트워크를 통한 데이터 다운로드가 발생한다. 이건 어떻게 해결할까..?
📌 검증 헤더와 조건부 요청 1
검증 헤더라는 것을 추가함으로써 위 문제를 해결할 수 있다.
서버는 데이터가 마지막으로 수정된 시간 정보를 캐시에 같이 저장한다.
그리고 캐시의 유효기간이 지난 후 다시 같은 것을 요청했다고 하자.
서버는 요청 헤더의 최종 수정일과 서버가 기존에 가지고 있던 최종 수정일을 비교할 수 있게 된다.
그럼 서버는 star.jpg를 응답하는 것이 아니라, 304 상태 코드와 헤더 메타 정보만 응답한다.
그렇기 때문에 기존 1.1MB에서 star.jpg의 용량이 빠진 0.1MB만 다운로드하여 전송할 수 있게 된다.
그리고 이 응답을 확인한 클라이언트는 캐시를 갱신하고 다시 캐시의 별을 활용할 수 있게 된다.
이 과정들은 분명 이점이 있다.
캐시를 사용함에도 유효기간이 지날 때 생기던 문제를 서버의 데이터가 갱신되지 않았으면 상태코드와 기본적인 헤더만 응답함으로써 어쨋든 다운로드는 발생하지만 용량을 적게 만들고, 기존 만료된 캐시 데이터를 재활용한다.
이는 매우 실용적인 해결책이라고 볼 수 있다.
📌 검증 헤더와 조건부 요청 2
✅ 검증 헤더
검증 헤더는 위 사례에서 보듯이 결국 캐시 데이터와 서버 데이터가 같은지 검증하는 데이터를 말한다.
이러한 검증 헤더에는, 아래 두 가지가 있다.
- Last-Modified
- ETag
✅ 조건부 요청 헤더
위 검증 헤더로 검증을 하다 보면, 다양한 분기의 상황이 발생한다.
이것을 헤더로서 표시하는 것이 조건부 요청 헤더이다.
이러한 조건부 요청 헤더에는 아래 두 가지가 있다.
- If-Modified-Since
- Last-Modified 검증 헤더를 사용한다.
- If-None-Match
- ETag 검증 헤더를 활용한다.
참고로 조건부 요청 헤더에서 조건에 만족하면 200 OK 상태코드를, 그렇지 않으면 304 Not Modified 상태코드를 제출한다.
✅ If-Modified-Since (Last-Modified 활용)의 단점
1초 미만의 소수점 단위 초단위(0.x 초)로는 캐시 조정이 불가능하다.
날짜 기반의 로직을 사용하는데, 이는 좋지 않다.
만약 데이터를 수정하긴 하는데 내용을 같게 수정한다면, 날짜는 달라지는데 결국 데이터는 같다. 그런데 그 데이터를 한 번 더 다운로드 해야 한다. 이러한 허점이 있다.
또한 서버에서 별도의 캐시 로직을 관리하고 싶을 수 있는데, 이는 클라이언트의 영향을 받는 캐시 로직 방식이다.
✅ If-None-Match (ETag 활용)
If-None-Match는 If-Modified-Since와 다르게, 캐시 데이터에 날짜를 활용하는 것이 아니라, 고유 버전 이름을 추가로 달아둔다.
그리고 데이터가 변경되면 이 버전의 이름을 바꾼다.
이름으로 비교하기 때문에 If-Modified-Since의 날짜의 허점을 해결한다.
그리고 캐시 제어 로직을 서버에서 완전히 관리하기 때문에, 클라이언트는 이를 알 필요가 없다.
📌 캐시와 조건부 요청 헤더
✅ 캐시 제어 헤더
캐시 제어 헤더에는 아래 세 종류가 있다.
- Cache-Control : 캐시 제어
- 캐시 지시어 Cache-Control에도 다양한 종류가 있다.
- Cache-Control: max-age
- 캐시 유효 시간 (초 단위)
- Cache-Control: no-cache
- 데이터는 캐시해도 되지만, 항상 Origin 서버에 검증한 후 사용한다.
- 이 개념은 이 후에 다시 자세히 배운다.
- Cache-Control: no-store : 데이터에 민감한 정보가 있어서 저장하지 않고 메모리에서 사용하고 최대한 빠르게 삭제한다.
- Pragma : 캐시 제어 (하위 호환)
- Expires : 캐시 유효 기간 (하위 호환)
- 날짜 단위 (이 때문에 날짜 단위보다 더욱 유연한 초 단위를 사용하는 Cache-Control이 더 좋다.)
이처럼 Pragma와 Expires는 Cache-Control의 완전한 하위호환이기 때문에 굳이 사용하지 않는다.
Cache-Control을 사용한다.
📌 프록시 캐시
✅ 프록시 캐시와 Cache-Control의 다른 종류들
기본적으로 프록시 캐시는 이러한 과정이다.
위 그림에서 처음보는 private 캐시와 public 캐시가 있다.
아래는 기타 캐시 지시어다.
- Cache-Control: public
- 응답이 public 캐시에 저장이 되어도 된다.
- Cache-Control: private
- 해당 응답이 해당 사용자 만을 위한 것이다.
- private 캐시에 저장해야 한다.
- Cache-Control: s-maxage
- 프록시 캐시에만 적용되는 max-age 옵션
- Age: 60 (HTTP Header)
- Origin 서버에 응답 후 프록시 캐시 내에 머문 시간 (초 단위)
📌 캐시 무효화
✅ 캐시 무효화와 관련된 Cache-Control 옵션들
- Cache-Control: no-cache
- 데이터는 캐시해도 되지만, 항상 Origin 서버(원 서버)에 검증하고 사용
- Cache-Control: no-store
- 데이터에 민감한 정보가 있으므로 저장하지 않고, 메모리에서 사용하고 최대한 빠르게 삭제해야함
- Cache-Control: must-revalidate
- 캐시 만료 후 최초 조회 시, Origin 서버에 반드시 검증해야 한다.
- Origin 서버 접근 실패 시 반드시 오류가 발생한다.
- 이 점이 no-cache와 다른 점
- 캐시 유효 시간 내라면 캐시를 사용한다.
✅ Cache-Control: no-cache VS Cache-Control: must-revalidate
기본적인 Cache-Control: no-cache의 동작 과정은 아래와 같다.
항상 Origin 서버에 검증한 후 해당 데이터를 사용한다.
그런데, 만약 중간에 연결이 끊겨버린다면 어떻게 될까?
데이터는 캐시할 수 있다고 했었으므로, 캐시 데이터를 반환할 수 있다.
그럼 Cache-Control: must-revalidate는 이 경우에 어떻게 다를까?
원 서버에 접근할 수 없는 경우, 반드시 오류가 발생하게 된다.
'Computer Science > Network' 카테고리의 다른 글
[모든 개발자를 위한 HTTP 웹 기본 지식] 7. HTTP 헤더 1 : 일반 헤더 (0) | 2024.01.19 |
---|---|
[모든 개발자를 위한 HTTP 웹 기본 지식] 6. HTTP 상태 코드 (1) | 2024.01.18 |
[모든 개발자를 위한 HTTP 웹 기본 지식] 5. HTTP 메서드 활용 (0) | 2024.01.18 |
[모든 개발자를 위한 HTTP 웹 기본 지식] 4. HTTP 메서드 (0) | 2024.01.18 |
[모든 개발자를 위한 HTTP 웹 기본 지식] 3. HTTP 기본 (0) | 2024.01.17 |
개발자가 되고 싶어요.