반응형
Notice
Recent Posts
Recent Comments
Link
관리 메뉴

짧은코딩

쿠키(Cookie)란? 본문

JS

쿠키(Cookie)란?

5_hyun 2023. 10. 17. 18:22
반응형

사실 쿠키를 자주 사용했었지만 정확하게 알고 있지는 못한 것 같아서 이 글에 정리하려고 한다. 

정확이 알고있지 못했던 것에 뭔가 부끄럼을 느끼고 반성한다..!

쿠키

쿠키는 오래전부터 사용해 왔다. HTTP 통신을 한다면 쿠키를 서로 주고받을 수 있다. 특히 같은 도메인이라면 다른 Scheme라도 쿠키를 공유할 수 있다.

쿠키를 중요하게 다뤄야하는 이유는 해커들이 다양한 방법으로 쿠키를 탈취하려고 하기 때문이다. HTTP는 Stateless 프로토콜이라 이런 쿠키를 통해 사용자 식별을 한다. 그렇기에 쿠키가 탈취되면 결국 사용자 개인 정보가 유출될 수 있다.

쿠키 속성들

path

path를 설정하면 설정한 URL의 경로를 포함한 하위 경로에서만 쿠키에 접근할 수 있다.

만약 path=/uplog로 했으면, /uplog/login, /uplog/mypage 같은 하위 주소에서만 쿠키에 접근이 가능하다.

domain

쿠키에 접근 가능한 도메인을 설정할 수 있다. uplog.store를 도메인으로 입력했으면 uplog.store, hi.uplog.store, api.uplog.store 같은 서브 도메인에서 쿠키를 사용할 수 있다.

만약 domain 설정을 하지 않았다면 uplog.store에서 생성된 쿠키는 서브 도메인에서는 이용할 수 없다.

expires, max-age

expries를 설정하지 않으면 쿠키는 브라우저가 닫힐 때 삭제된다. 설정하면 설정 기간 이후에 삭제된다.

max-age는 쿠키를 얼마나 유지하는지이다. 0으로 지정하면 바로 삭제된다.(expires의 대안)

samesite

사이트 외부에서 쿠키에 대한 접근을 막는다. XSRF(크로스 사이트 요청 위조) 공격을 막기 위한 속성이다.

 

-참고하면 좋은 글

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/

 

브라우저 쿠키와 SameSite 속성 / seob.dev

브라우저 쿠키에 대한 기본적인 내용들, 그리고 웹 개발자들에게 중요한 "SameSite" 속성을 다룹니다. "SameSite" 속성이 어떤 속성인지, 각 브라우저에서 어떻게 동작하고 있는지 알아봅니다.

seob.dev

httponly

해커들이 JS로 쿠키를 가로채려고 시도를 하는데 대표적으로 XSS(Cross Site Scripting)이다. 그렇기에 httponly 옵션을 활성화하면 브라우저에서 쿠키에 접근할 수 없도록 제한을 한다. 

쿠키에 포함된 정보들 대부분이 브라우저에선 필요 없기에 httponly 옵션을 활성화하는 것이 좋다.

secure

HTTP Only를 사용하면 Client에서 발생하는 쿠키 탈취는 막을 수 있다. 하지만 네트워크를 통해 쿠키를 탈취하는 방법도 있다.

실제로 여러 정보기관들이 통신망을 통해 개인정보를 열람하고 있다. 이런 방법으로 유출되는 것을 막기 위해 HTTPS 프로토콜을 사용한다.

secure 옵션을 설정하면 브라우저는 HTTPS가 아닌 통신에서는 쿠키를 전송하지 않는다.

 

-참고

https://nsinc.tistory.com/121

 

[Web] HTTP Only와 Secure Cookie 이해하기

Cookie에 대한 이해 쿠키는 ASP.NET, PHP와 같은 특정 기술영역에 국한된 것도 아니고, 특정 Client나 Server에만 국한된 기술도 아닙니다. 쿠키는 수십 년 전부터 사용되어 왔으며 최근에는 HTTP에 있어서

nsinc.tistory.com

https://velog.io/@haiseong/Set-Cookie%EB%A1%9C-%EB%B8%8C%EB%9D%BC%EC%9A%B0%EC%A0%80%EC%97%90-%EC%BF%A0%ED%82%A4-%EC%A0%80%EC%9E%A5%ED%95%98%EA%B8%B0

 

Set-Cookie로 브라우저에 쿠키 저장하기

Cookie 세션 스토리지, 로컬 스토리지, 등등 웹 브라우저에는 정보를 저장할 수 있는 공간이 있다. 최근에 jwt 인증방식을 위해 쿠키를 구워야 했다. 쿠키는 유저들의 효율적이고 안전한 웹 사용을

velog.io

 

반응형

'JS' 카테고리의 다른 글

브라우저 로딩 과정  (2) 2023.12.06
클로저  (0) 2023.11.30
변수 호이스팅과 값의 할당  (0) 2023.08.25
"forEach" vs "map"  (0) 2023.07.13
얕은 복사와 깊은 복사  (0) 2022.11.17
Comments