퍼스트 파티 쿠키 레시피

보안과 교차 브라우저 호환성을 보장하고 서드 파티 쿠키의 단계적 지원 중단 후 중단 가능성을 최소화하기 위해 퍼스트 파티 쿠키를 설정하는 방법을 알아보세요.

Milica Mihajlija

쿠키는 사용자가 현재 어떤 사이트에 있는지에 따라 사용자의 상황에 따라 제1사 또는 제3자 쿠키가 될 수 있습니다. 쿠키의 등록 가능한 도메인 및 스키마가 현재 최상위 페이지(즉, 브라우저의 주소 표시줄에 표시되는 페이지)와 일치하는 경우 쿠키는 페이지와 동일한 사이트에서 온 것으로 간주되며 일반적으로 퍼스트 파티 쿠키라고 합니다.

현재 사이트 이외의 도메인의 쿠키를 일반적으로 서드 파티 쿠키라고 합니다.

설정 중인 쿠키가 사이트 전반에서 사용되지 않는 경우(예: 사이트에서 세션을 관리하는 데 사용되고 크로스 사이트 iframe에서는 사용되지 않는 경우) 해당 쿠키는 항상 퍼스트 파티 맥락에서 사용됩니다.

기본적으로 쿠키는 사이트 간에 공유되고 JavaScript로 액세스되며 HTTP 연결을 통해 전송될 수 있으므로 개인 정보 보호 및 보안 위험이 수반됩니다. 기본 동작을 개선하기 위한 작업이 진행되고 있지만 개인 정보 보호 샌드박스 및 출처 바운드 쿠키와 같은 기타 제안을 통해 쿠키에 추가 속성을 설정하여 다양한 작업을 수행할 수 있습니다.

다음 구성은 대부분의 퍼스트 파티 쿠키의 보안 및 교차 브라우저 호환성을 보장하기 위한 권장사항입니다. 이를 통해 안전한 기반을 마련할 수 있으며, 필요한 경우에만 권한을 열 수 있도록 조정할 수 있습니다. 이 도움말에서는 일부 특정 사용 사례의 레시피 변형도 다룹니다.

레시피

Set-Cookie:
__Host-cookie-name=cookie-value;
Secure;
Path=/;
HttpOnly;
Max-Age=7776000;
SameSite=Lax;
세부정보

Host 는 일부 속성을 필수로 만들고 다른 속성은 금지하는 선택적 접두사입니다.

  • Secure이(가) 있어야 합니다.
  • Domain은(는) 생략해야 합니다.
  • Path는 /여야 합니다.

Host를 추가하면 브라우저에서 이러한 속성이 __Host 규칙에 따라 설정되었는지 확인하고 그렇지 않은 경우 쿠키를 거부할 수 있습니다.

Secure는 HTTPS 연결을 통해서만 쿠키 전송을 허용하므로 안전하지 않은 네트워크에서 쿠키가 도난당하지 않도록 보호합니다. 아직 사이트를 HTTPS로 이전하지 않았다면 그것을 우선시합니다.

Domain 속성은 쿠키를 수신할 수 있는 호스트를 지정합니다. 이를 생략하면 쿠키가 하위 도메인을 제외한 현재 문서 호스트로 제한됩니다. example.com에 대한 쿠키는 example.com에 대한 모든 요청에서 전송되지만 images.example.com에 대한 요청에서는 전송되지 않습니다. 서로 다른 하위 도메인에서 여러 앱을 실행하는 경우, 이렇게 하면 하나의 도메인이 도용되어 다른 도메인으로의 진입을 허용할 위험을 줄일 수 있습니다.

Path는 브라우저가 Cookie 헤더를 전송할 수 있도록 요청된 URL에 있어야 하는 경로를 나타냅니다. Path=/를 설정하면 쿠키가 해당 도메인의 모든 URL 경로로 전송됩니다. Domain와 Path=/를 조합하지 않으면 쿠키가 출처에 최대한 가깝게 바인딩되므로 LocalStorage와 같은 다른 클라이언트 측 스토리지와 유사하게 동작합니다. example.com/a가 example.com/b에 다른 값을 수신할 수도 있다는 혼란이 없습니다.

HttpOnly 속성은 JavaScript 액세스를 제한하여 사이트에서 악성 서드 파티 스크립트로부터의 보호 조치를 추가합니다. 요청 헤더에서만 쿠키를 보낼 수 있도록 허용하고 document.cookie를 사용하여 JavaScript에서 쿠키를 사용할 수 없도록 합니다.

Max-Age는 브라우저 세션이 상당히 오래 지속될 수 있고 오래된 쿠키가 영원히 머무르는 것을 원하지 않기 때문에 쿠키의 수명을 제한합니다. 사용자 세션과 같은 단기 쿠키 또는 양식 제출용 토큰과 같은 더 짧은 쿠키에 적합합니다. Max-Age는 초 단위로 정의되며 이전 예에서는 7776,000초(90일)로 설정됩니다. 이는 합당한 기본값이며 사용 사례에 따라 변경할 수 있습니다.

SameSite=Lax는 동일한 사이트 요청 시에만 쿠키가 전송되도록 제한합니다. 즉, 요청이 현재 브라우징 컨텍스트(사용자가 현재 방문하고 있으며 위치 표시줄에 표시되는 최상위 사이트)와 일치하는 경우입니다. 최신 브라우저에서는 SameSite=Lax가 기본값이지만, 여러 브라우저에서는 기본값이 다를 수 있으므로 호환성을 위해 지정하는 것이 좋습니다. 쿠키를 동일 사이트 전용으로 표시하면 퍼스트 파티 맥락으로만 쿠키를 제한하게 되며, 서드 파티 쿠키가 사라진 후에도 해당 쿠키를 변경할 필요가 없습니다.

다양한 쿠키 속성에 관한 자세한 내용은 MDN에 관한 Set-Cookie 문서를 참고하세요.

사이트에 하위 도메인이 있고 이 모든 하위 도메인에 걸쳐 하나의 세션을 갖고 싶다면 Host 접두사가 너무 제한적일 수 있습니다. 예를 들어 news.site에 finance.news.site 및 sport.news.site와 같은 주제에 대한 하위 도메인이 있을 수 있으며 모든 하위 도메인에 대해 하나의 사용자 세션이 필요합니다. 이 경우 __Host 대신 __Secure 접두사를 사용하고 Domain를 지정하세요.

레시피

Set-Cookie:
__Secure-cookie-name=cookie-value;
Secure;
Domain=news.site;
Path=/;
HttpOnly;
Max-Age=7776000;
SameSite=Lax;
세부정보

Secure 은 Host보다 적은 요구사항을 어설션하는 선택적 접두사입니다. Secure 속성으로만 쿠키를 설정하면 됩니다.

SameSite=Lax 쿠키는 크로스 사이트 하위 요청에서 전송되지 않지만 (예: 삽입된 이미지 또는 iframe을 서드 파티 사이트에서 로드할 때) 사용자가 원래 사이트로 이동할 때 (예: 다른 사이트의 링크를 따라갈 때) 전송됩니다.

SameSite=Strict를 사용하여 서드 파티 웹사이트에서 시작된 요청과 함께 쿠키 액세스를 제한하고 전송을 금지할 수 있습니다. 이 기능은 비밀번호 변경이나 구매와 같이 초기 탐색 뒤에 항상 존재하는 기능과 관련된 쿠키가 있을 때 유용합니다.

레시피

Set-Cookie:
__Host-cookie-name=cookie-value;
Secure;
Path=/;
HttpOnly;
Max-Age=7776000;
SameSite=Strict;