서드 파티와 퍼스트 파티 쿠키와 보안

쿠키의 옵션

HTTP Only

쿠키는 document.cookies 명령어를 통해 현재 브라우저에 있는 쿠키 정보를 조회할 수 있습니다. 따라서 해커가 이를 이용하여 쿠키를 습득해 사용자의 권한을 얻는 XSS 공격에 취약하다는 단점이 있습니다.

하지만HTTPOnly 옵션을 사용하면 자바스크립트로 쿠키에 접근하는 것을 막을 수 있어 XSS 공격을 막을 수 있습니다.

Set-Cookie: cookie=value; HttpOnly;

다음 헤더를 통해 HttpOnly 가 적용된 쿠키를 생성할 수 있습니다.

Secure

클라이언트의 요청을 통해 서버로 전송되는 데이터는 제 3자가 요청을 가로채 쿠키의 정보를 조회할 수 있습니다.

이는 SSL 암호화 계층이 추가된 https를 통해서 막을 수 있습니다.
쿠키의 secure 옵션을 추가하게 되면 https 통신으로만 쿠키가 전달이 됩니다.

Set-Cookie: cookie=value; secure;

Domain

Set-Cookie: cookie=value; Domain=velog.io

다음과 같이 Domain 옵션으로 도메인을 지정할 수 있는데, 이는 velog.io 를 대상으로 한 요청에서만 쿠키가 전달됩니다. 즉 , velog.io 에서만 유효한 쿠키가 됩니다.

이때 도메인을 별도로 지정하지 않으면 쿠키를 생성한 서버의 도메인을 따르게 되며, 하위 도메인에서의 요청도 쿠키가 전달됩니다.

예) velog.io 도메인이 설정된 쿠키는 local.velog.io 에서도 사용이 가능합니다.

SameSite

이는 서드 파티 쿠키 , 퍼스트 파티 쿠키를 허용할지 선택하는 옵션으로 총 3가지로 나뉩니다.

• Strict : 동일한 도메인에서만 쿠키가 전송됩니다. ( 퍼스트 파티 쿠키만 허용 )
• None : 다른 도메인에서 쿠키 전송이 가능합니다. ( 서드 파티 쿠키 전송을 허용 )
• Lax : 서드 파티 쿠키를 허용하지 않지만 예외적인 부분이 존재합니다.
  - 예외 적인 부분이란 Top Level Navigation에 해당되는 <a> 링크를 누르거나 window.location.replace , 302 이동만 허용됩니다.
  • POST , DELETE 와 같은 서버의 자원이 변하는 요청은 전송되지 않습니다.

크롬에서는 서드 파티 쿠키를 허용하기 위해서 SameSite=None 옵션과 secure 옵션을 동시에 지정해 주어야 합니다. 또한 크롬은 2023년부터 서드 파티 쿠키를 지원하지 않아 곧 지원이 종료될 것이라 예상됩니다.

서드 파티 쿠키와 퍼스트 파티 쿠키

서드 파티 쿠키는 사용자가 접속한 페이지와 다른 도메인으로 쿠키가 전송되는 것을 말합니다.
예를 들어 사용자가 naver.com 에 접속하고 있지만 , naver.com 가 google.com 에 대한 요청을 할 때 사용자가 google.com 도메인을 가진 쿠키를 가지고 있다면 해당 쿠키를 전송하게 됩니다.
자세히 말하면 Referer 헤더의 도메인과 쿠키의 도메인이 다른 경우라고 할 수 있습니다. 이는 google.com 링크를 눌렀을 때도 서드 파티 쿠키가 됩니다. 그 이유는 Referer 헤더는 리다이렉트되기 전인 naver.com이기 때문이죠.

퍼스트 파티 쿠키는 서드 파티 쿠키와는 달리 사용자가 접속한 페이지와 같은 도메인의 쿠키가 전송되는 것을 말합니다.

CSRF 문제

CSRF(Cross Site Request Forgery) 는 HTTP 요청에 대해 모든 쿠키가 전송되는 취약점을 노리게 됩니다. CSRF는 간단히 말하면 공격자가 악의적인 스크립트를 삽입하여 사용자에게 특정 HTTP 요청을 유도하는 공격 기법을 말합니다.

이는 SameSite 옵션을 활용해서 문제를 해결할 수 있는데 서드 파티 쿠키의 보안적 문제를 해결하기 위해 사용됩니다.

SameSite 의 구현

크롬은 SameSite 를 적극적으로 구현하는 브라우저로 크롬 버전 80 이 되면서 SameSite를 적용하지 않으면 기본값이 None 으로 선택됐던 옵션이 LAX 가 지정되게 바뀌었습니다.

만약 SameSite 를 None으로 지정하고 싶다면 secure 옵션을 선택해 주어야하는데 만약 None으로 지정했지만 secure 옵션을 지정하지 않았다면 쿠키가 저장되지 않습니다.

쿠키의 미래

크롬은 서드 파티 쿠키를 제거한다는 계획을 갖고 있는데 결국 퍼스트 파티 쿠키로만 구현이 되는 상황이 올 수 있습니다. 이때 구글은 First-Party Sets 이라는 기술을 제안하였는데, 이는 여러 개의 도메인을 같은 사이트로 취급하는 것을 말합니다. 예를 들어 naver.com , google.com 모두 같은 서비스를 제공한다고 브라우저에 말해주면 같은 사이트로 취급하는 것을 말합니다. 하지만 반대 여론이 많아 어떻게 될지 결정이 나지 않고 있습니다.

Request With Credentials

브라우저는 비동기 리소스 요청 API 인 XMLHttpRequest 나 fetch API 는 별도의 옵션이 없다면 쿠키 정보나 인증 관련 헤더를 요청에 담지 않습니다.

따라서 만약 인증 정보를 담고 싶다면 credentials 옵션을 설정을 해주어야 합니다.
- same-origin : 동일 출처 내에서만 인증 정보를 담을 수 있습니다. ( 기본 값 )
- include : 모든 요청에 인증 정보를 담습니다.
- omit : 모든 요청에 대해 인증 정보를 담을 수 없습니다.

XMLHttpRequest 는 withCredentials 옵션을 이용해서 인증 정보를 담을 수 있게 설정할 수 있습니다. 만약 같은 출처라면 영향을 주지 않습니다. ( same-origin )

이때 클라이언트에서 withCredentials 옵션을 설정했을 경우에는 응답 헤더에 Access-Control-Allow-Credentials 값을 true 로 설정해 주어야 합니다.

또한 Access-Control-Allow-Origin 헤더의 와일드카드* 를 넣을 수 없고 고정된 값을 넣어주어야 합니다.

참고

참고 블로그 1 : https://pomo0703.tistory.com/207
참고 블로그 2 : https://seob.dev/posts/%EB%B8%8C%EB%9D%BC%EC%9A%B0%EC%A0%80-%EC%BF%A0%ED%82%A4%EC%99%80-SameSite-%EC%86%8D%EC%84%B1/
참고 블로그 3 : 참고