Web Cookie에 대해

김민준·2023년 3월 29일
0

Frontend

목록 보기
14/14
post-thumbnail

로그인/로그아웃 구현 중 서브 도메인이 다른 상황에 쿠키 값을 공유해야 하는 상황이 생겨 Cookie에 대해 알아보았습니다.

Cookie란?

  • 쿠키는 웹사이트 접속 시 접속자의 개인장치에 다운로드 되고 브라우저에 저장되는 작은 텍스트 파일 입니다.
  • 브라우저는 그 데이터 조각들을 저장해 놓았다가, 동일한 서버에 재 요청 시 저장된 데이터를 함께 전송하게 됩니다.
  • Header의 Set-Cookie로 전달합니다.
  • 클라이언트는 서버로 전송하는 요청에 현재 브라우저에 저장된 쿠키를 header의 Cookie로 전달

브라우저가 종료되더라고 쿠키 유지하는 방법

  • Expires 또는 Max-Age 옵션을 추가합니다.
  • Expries : 쿠키가 만료될 날짜 지정
  • Max-Age : 현재 시간 기준으로 얼마동안 쿠키를 유지할지 지정

주로 사용 되는 쿠키 용도

  1. ID 정보 저장 -> 로그인 상태 유지
  2. 최근 검색한 정보 광고 추천
  3. 쇼핑몰 장바구니 기능
  4. 3일 7일 등 일정기간 보지 않기 체크 하기

쿠키 제어 옵션

  • Secure : HTTPS 프로토콜 상 암호화된 요청일 경우 전송

  • HttpOnly : Cross-Site 스크립트 공격 방지.

  • Domain : 쿠키가 전송되게 될 호스트 명시

  • Path : 쿠키 Heafer 전송을 위해 요청되는 URL 경로

  • SameSite : 쿠키가 cross-site 요청과 함께 전송되지 않음을 요구 -> 위조 공격에 대한 보호 방법 할 수 있으며 이 종류에는 3가지가 있습니다.

    • SameSite 종류

      1. None: None으로 설정된 쿠키의 경우 크로스 사이트 요청의 경우에도 항상 전송됩니다. 즉, 서브도메인 쿠키도 전송됩니다. 따라서, 보안적으로도 SameSite 적용을 하지 않은 쿠키와 마찬가지로 문제가 있는 방식입니다.

      2. Strict: Strict로 설정된 쿠키는 크로스 사이트 요청에는 항상 전송되지 않습니다. 즉, 서브도메인 쿠키는 전송되지 않고, 메인 도메인 쿠키만 전송됩니다.

      3. Lax: Lax로 설정된 경우, 대체로 서드 파티 쿠키는 전송되지 않지만, 몇 가지 예외적인 요청에는 전송됩니다.

제가 작업을 했을 때 크롬 브라우저로 작업을 진행 하였고, 크롬 브라우저는 쿠키에 대한 SameSite 종류는 Lax로 서브 도메인이 달라도 쿠키가 공유되는 권한으로 기본 설정 되어 SameSite의 옵션이 필요 없었지만 다른 브라우저에도 쿠키가 공유가 필요했기 때문에 Cookie 옵션에 SameSite를 추가 해줬습니다.

profile
이번엔

0개의 댓글