브라우저는 내부에서 데이터를 저장할 수 있는 수단으로 크게 3가지, 로컬 스토리지, 세션 스토리지, 쿠키가 있습니다.
쿠키 : 해당 도메인에 대해 만료 기한이 있는 데이터를 저장할 때
로컬 스토리지 : 해당 도메인에 대해 영구적으로 데이터를 저장할 때
세션 스토리지 : 해당 세션(탭)에 종속되는 데이터를 저장할 때 (창을 닫으면 데이터가 날아감)
그중에서 우리는 쿠키에 대해 알아보겠습니다. 쿠키는 만료 기한이 있을 때 사용되기에 대표적으로 '회원 인증 정보', '팝업의 다시보지 않기', '행동 분석 트래킹 ID' 등에 사용됩니다.
쉬운 예시로 네이버 로그인을 들 수 있습니다. 네이버에서 로그인을 한 번 하고 나면 나중에 다시 들어왔을 때 계속 로그인이 되어있죠. 쿠키에 여러분의 인증 정보가 들어있기 때문에 네이버 서버에서는 여러분이 어떤 회원인지 파악이 가능하고 자원을 제공할 수 있겠죠?
우리가 웹 서비스를 사용하다 보면 다양한 이벤트 팝업을 보게 됩니다. 그리고 귀찮은 마음에 '1주일 동안 보지 않기'를 클릭합니다. 실제로 사이트를 나갔다가 들어오면 팝업이 다시 보이지 않죠? 이는 해당 팝업을 보지 않겠다는 신호를 쿠키로 저장했기 때문이에요. 하지만 쿠키는 유효기간을 가지고 있어요. 그래서 시간이 지나고 나면 브라우저가 쿠키를 지우고 다시 팝업이 보이게 될 거예요.
[참고1]
세션이라는 용어도 자주 들어보셨을 겁니다. 세션도 쿠키와 유사하게 만료 기한이 정해진 데이터를 의미합니다. 그러나 세션은 브라우저가 아닌 서버에서 저장된다는 차이가 있습니다.
서버에서는 세션을 이용해 마감 기한이 있는 데이터들을 관리할 때 사용됩니다. 대표적으로 로그인을 가능하게 하는 인증 서버를 구현할 때 세션을 이용해서 회원을 구분합니다.
[참고2]
우리가 브라우저로 서핑을 할 때 귀찮게 쫓아다니는 리타겟팅 광고도 쿠키를 기반으로 동작합니다 ➡️ 리타겟팅 광고 원리 쉽게 이해하기
HTTP에서부터 WEBSOCKET까지
브라우저를 통해 웹을 이용한다면 HTTP, Websocket 기술이 필수적으로 들어갑니다. 해당 아티클은 비전공자 입장에서 쉽고 재미있게 작성되었어요. 상식도 쌓을 겸 읽어보시는 걸 추천합니다.
- HTTP : 통신 제약이 있는 약속
- AJAX : HTTP의 통신 제약으로부터 조금 벗어날 수 있었음
- Websocket : HTTP의 통신 제약을 해결한 새로운 약속입니다.
- ...
댓글 3개
의견을 남겨주세요
안승환
오늘도 뉴스레터 잘 봤습니다 :) 마케터인데 IT 지식이 필요하다고 생각해서 구독했는데 내용에 정말 만족합니다. 아 문의드리고 싶은 게 하나 있어요. 5명 이상 초대를 하면 [IT 개발자를 이해하기 위한 모든 개발 지식 A to Z] 수강권을 제공해주신다고 하셨는데, 언제 받을 수 있을지 알 수 있을까요? 답변 부탁드리고, 항상 좋은 뉴스레터 감사드려요 :)
그랩의 IT 뉴스레터
안녕하세요 스벅골드레벨님 ! 방금 메일 보내드렸는데 확인 부탁드립니다😃
안승환
네 메일 확인했습니다. 인프런 가입하고, 답장으로 메일 주소 보내드렸어요 ~ :)
의견을 남겨주세요