[네트워크] 캐시, 쿠키, 웹스토리지 개념

캐시

캐시는 불필요한 대역폭 낭비와 응답 지연을 방지하기 위해

사본을 웹 브라우저에 저장한다.

서버의 원본 데이터가 변경되었는데, 계속 사본을 참조하는 상황이 생길 수 있다.

캐시 신선도를 검사해야 한다.

유효기간을 설정하고 기간 만료시 원본 데이터를 다시 요청한다.

Expires 헤더(날짜)와 Cache-Control 헤더의 Max-Age 값(초)을 사용할 수 있다

If-Modifed-Since 는 변경이 되었을 경우만 새 자원으로 응답한다.

200 OK 응답이나 304 Not Modified 로 자원이 그대로거나 404 Not Found 자원이 삭제되어 없는 경우가 있다.

Last-Modeifed를 통해 마지막으로 수정된 시점도 나온다.

 

쿠키

쿠키는 서버에서 생성되어 클라이언트에 저장된다.

상태를 유지하지 않아서 서버가 클라이언트의 상태를 알 수 있는 데이터다.

클라이언트는 서버로 보내는 요청에 쿠키를 포함하여 전송한다.

서버는 쿠키 정보를 통해 같은 클라이언트에서 왔는지, 로그인 상태를 유지하고 있는지 등을 안다.

쿠키를 통해 전달되는 정보는 세션 아이디다.

클라이언트가 서버에게 인증 정보를 전송하는데,

올바르다면 서버는 세션 아이디를 생성해 클라이언트로 전송한다.

서버는 세션아이디를 데이터베이스 등에 저장한다.

서버는 쿠키 속 세션 아이디와 디비에 저장된 세션 아이디를 비교해 클라이언트를 식별한다.

 

응답 메시지의 Set-Cookie 헤더와 Set-Cookie: name=John Set-Cookie: age=10

요청 메시지의 Cookie 헤더 Cookie: name=John; age=10  를 통해 전달된다.

 

브라우저에서 개발자도구를 열고 Application Storage Cookies에서 확인할 수 있다.

 

쿠키는 쉽게 노출되거나 조작된다.

이를 보완하기 위해 Secure와 HttpOnly라는 속성이 있다.

HttpOnly는 자바스크립트에서 (해커가) 쿠키를 위변조할 수 없도록 방지한다.

Secure는 HTTPS 프로토콜이 사용될 때만 쿠키를 전송한다.

 

웹스토리지: 로컬스토리지와 세션스토리지

웹스토리지도 클라이언트의 상태를 추측할 수 있다.

웹스토리지는 서버로 자동으로 전송되지 않는다.

Application Storage에서 확인할 수 있다.