SameSite 쿠키 설명

브라우저 지원

  • Chrome: 51
  • Edge: 16.
  • Firefox: 60
  • Safari: 13.

소스

모든 쿠키에는 키-값 쌍과 함께 쿠키가 사용되는 시점과 위치를 제어하는 여러 속성이 포함됩니다.

SameSite 속성(RFC6265bis에 정의됨)을 도입하면 쿠키가 퍼스트 파티 또는 동일 사이트 컨텍스트로 제한되는지 여부를 선언할 수 있습니다. 여기서 '사이트'가 의미하는 바를 정확히 이해하면 도움이 됩니다. 사이트는 도메인 접미사와 그 바로 앞의 도메인 부분을 조합한 것입니다. 예를 들어 www.web.dev 도메인은 web.dev 사이트의 일부입니다.

핵심 용어: 사용자가 www.web.dev에 있고 static.web.dev에서 이미지를 요청하는 경우 동일 사이트 요청입니다.

공개 서픽스 목록은 동일한 사이트에 있는 것으로 간주되는 페이지를 정의합니다. .com와 같은 최상위 도메인에 종속될 뿐만 아니라 github.io와 같은 서비스도 포함할 수 있습니다. 이렇게 하면 your-project.github.iomy-project.github.io가 별도의 사이트로 집계됩니다.

주요 용어: 사용자가 your-project.github.io에 있고 my-project.github.io에서 이미지를 요청하는 경우 교차 사이트 요청입니다.

SameSite 속성을 사용하여 쿠키 사용을 선언합니다.

쿠키의 SameSite 속성은 이 동작을 제어하는 세 가지 방법을 제공합니다. 속성을 지정하지 않거나 Strict 또는 Lax를 사용하여 동일한 사이트 요청으로 쿠키를 제한할 수 있습니다.

SameSiteStrict로 설정하면 쿠키가 퍼스트 파티 컨텍스트에서만 전송될 수 있습니다. 즉, 쿠키의 사이트가 브라우저의 주소 표시줄에 표시된 사이트와 일치하는 경우에만 쿠키가 전송될 수 있습니다. 따라서 promo_shown 쿠키가 다음과 같이 설정된 경우

Set-Cookie: promo_shown=1; SameSite=Strict

사용자가 사이트에 있으면 쿠키가 예상대로 요청과 함께 전송됩니다. 그러나 사용자가 다른 사이트에서 내 사이트로 연결되는 링크를 클릭하면 초기 요청 시 쿠키가 전송되지 않습니다. 이는 비밀번호 변경 또는 구매와 같이 항상 초기 탐색 뒤에 있는 기능과 관련된 쿠키에 유용하지만 promo_shown와 같은 쿠키에는 너무 제한적입니다. 독자가 링크를 따라 사이트로 이동하면 환경설정을 적용할 수 있도록 쿠키가 전송되기를 원합니다.

SameSite=Lax를 사용하면 브라우저가 이러한 최상위 탐색과 함께 쿠키를 전송할 수 있습니다. 예를 들어 다른 사이트에서 내 사이트의 콘텐츠를 참조한다면 다음과 같이 고양이 사진을 사용하고 기사 링크를 제공합니다.

<p>Look at this amazing cat!</p>
<img src="https://blog.example/blog/img/amazing-cat.png" />
<p>Read the <a href="https://blog.example/blog/cat.html">article</a>.</p>

쿠키가 다음과 같이 Lax로 설정된 경우:

Set-Cookie: promo_shown=1; SameSite=Lax

브라우저가 다른 사용자의 블로그에 대해 amazing-cat.png를 요청하면 사이트에서 쿠키를 전송하지 않습니다. 하지만 독자가 사이트의 cat.html 링크를 클릭하면 요청에 쿠키가 포함됩니다.

이와 같이 SameSite를 사용하여 웹사이트 표시에 영향을 미치는 쿠키를 Lax로, 사용자 작업과 관련된 쿠키를 Strict로 설정하는 것이 좋습니다.

SameSiteNone로 설정하여 모든 컨텍스트에서 쿠키를 전송할 것임을 나타낼 수도 있습니다. 위젯, 삽입된 콘텐츠, 제휴 프로그램, 광고, 여러 사이트에서 로그인과 같이 다른 사이트에서 사용하는 서비스를 제공하는 경우 None를 사용하여 의도를 명확하게 전달하세요.

컨텍스트에 따라 None, Lax, Strict로 라벨이 지정된 세 개의 쿠키
쿠키의 컨텍스트를 None, Lax 또는 Strict로 명시적으로 표시합니다.

SameSite 없이 기본 동작 변경

브라우저 지원

  • Chrome: 80.
  • Edge: 86.
  • Firefox: 깃발 뒤쪽에 있습니다.
  • Safari: 지원되지 않음

SameSite 속성은 널리 지원되지만 널리 채택되지는 않았습니다. 이전에는 SameSite 없이 쿠키를 설정하면 기본적으로 모든 컨텍스트에서 쿠키가 전송되었으므로 사용자가 CSRF에 취약하고 의도치 않은 정보 유출이 발생할 수 있습니다. 개발자가 자신의 의도를 밝히고 사용자에게 더 안전한 환경을 제공하도록 장려하기 위해 IETF 제안인 점진적으로 향상된 쿠키에서는 다음 두 가지 주요 변경사항을 설명합니다.

  • SameSite 속성이 없는 쿠키는 SameSite=Lax로 간주됩니다.
  • SameSite=None가 있는 쿠키는 Secure도 지정해야 합니다. 즉, 보안 컨텍스트가 필요합니다.

이러한 두 가지 변경사항은 이전 버전의 SameSite 속성을 올바르게 구현한 브라우저와 이전 SameSite 버전을 지원하지 않는 브라우저와 하위 호환됩니다. 쿠키 동작과 의도된 사용을 명시적으로 지정하여 개발자가 브라우저의 기본 동작에 의존하는 것을 줄이기 위한 것입니다. SameSite=None를 인식하지 못하는 클라이언트는 이를 무시해야 합니다.

기본값은 SameSite=Lax입니다.

SameSite 속성을 지정하지 않고 쿠키를 전송하면 브라우저는 해당 쿠키를 SameSite=Lax로 설정된 것처럼 취급합니다. 브라우저 간에 사용자 환경을 더 일관되게 만들려면 SameSite=Lax를 명시적으로 설정하는 것이 좋습니다.

SameSite=None은 안전해야 합니다.

SameSite=None를 사용하여 크로스 사이트 쿠키를 만들 때는 브라우저에서 이를 수락할 수 있도록 Secure로 설정해야 합니다.

Set-Cookie: widget_session=abc123; SameSite=None; Secure

이 동작은 Chrome 76부터 about://flags/#cookies-without-same-site-must-be-secure를 사용 설정하거나 Firefox 69부터 about:config에서 network.cookie.sameSite.noneRequiresSecure를 설정하여 테스트할 수 있습니다.

또한 기존 쿠키를 최대한 빨리 Secure로 업데이트하는 것이 좋습니다. 사이트에서 서드 파티 콘텐츠를 제공하는 서비스를 이용하는 경우 서비스 제공업체에서 쿠키를 업데이트하고 새로운 동작을 사용할 수 있도록 사이트의 스니펫이나 종속 항목을 업데이트해야 합니다.

SameSite=None의 이러한 변경사항과 브라우저 동작의 차이를 성공적으로 처리하도록 쿠키를 업데이트하는 방법에 관한 자세한 내용은 후속 도움말인 SameSite 쿠키 레시피를 참고하세요.

릴리 첸, 몰테 우블, 마이크 웨스트, 롭 도슨, 톰 스타이너, 비벡 세카르의 기여와 의견에 감사드립니다.

UnsplashPille-Riin Priske님이 만든 쿠키 히어로 이미지