브라우저쿠키(Cookie),로컬스토리지(LocalStorage),세션스토리지(sessionStorage)

임동현·2022년 4월 12일
0

요약
데이터베이스를 사용하지않고 데이터를 임시적인 용도로 저장 할 때 사용하는것
-대부분의 데이터는 데이터 베이스에 저장하고 해당하는 사용처에 따라 쿠키,세션스토리지,로컬스토리지를 적절히 사용해야한다.
-대부분 임시적인 용도의 데이터나 캐시 , history 기능을 위해 사용한다.
-글 작성 중간에 임시로 글을 저장하는 용도로 많이 사용된다. (form)
-쇼핑몰의 장바구니 , 좋아하는 콘텐츠 (찜,좋아요와 같은 기능들) 등 수시로 변경되는 정보를 저장 할 때 사용한다.
방문자의 이동 경로를 저장하였다가 이동 시에 사용한다.
-그외 서버에 저장할 필요가 없는 정보들을 저장 할 때 사용한다.
-가장 중요한 것은 보안적인 문제가 될 만한 것들을 저장할 때 사용하면 안된다.

쿠키

-브라우저 요청이 있을 경우 자동으로 서버에 전송한다.
-사용자의 하드에 저장되어 보안 위험이 있다.
-같은 도메인 상에서 쿠키 값은 공유된다.
-하나의 쿠키는 4KB 까지 저장가능하다.
-key,value 데이터 파일로 이름 ,값,만료 날짜 (저장 날짜),경로 정보가 필요하다.

(웹사이트 에서의 쿠키)

-필수적인 쿠키 : 페이지 탐색, 웹 사이트 보안 영역 접속, 기본 기능 활성화
-기능 쿠키 : 접속자의 지역 ,언어등
-성능 쿠키 :정보의 익명 수집,보고
-마케팅 쿠키 : 방문 내역 추적

스토리지

-쿠키의 단점을 보완해서 만든 기술이다.
-key,value 로 이루어진 데이터 파일이다.
-서버의 자원이 사용하므로 서버의 공간이 필요하다
-기기마다 차이는 있으나 모바일 2.5MB,데스크탑5MB~10MB 정도 저장가능
-쿠키 보다 보안이 우수하며 많은 정보를 담을 수 있다.
-Local Storage,Session Storage 로 나뉘며 데이터의 만료에 따라 나뉜다. ( 사용자가 데이터를 삭제하지 않는 한)
-Local Storage = 만료기한 없음 ,Session Storage =세션 종료 시 만료

쿠키가 서버로 계속 전송 되는 이유가 무엇일까??
1. HTTP 요청은 클라이언트의 상태에 대한 정보를 가지고 있지 않다.
2. 브라우저에서 서버로 클라이언트에 대한 정보를 가져오라는 Get 요청을 보낼때, 서버는 요청 자체만으로 그 요청이 어떤 클라이언트에게서 온 것인지 정보가 없다.
3.그래서 요청에 대한 응답을 할 수 없는데 , 이 때 쿠키에 클리어언트의 정보를 담아서 서버에 보내면 서버는 쿠키를 읽어서 클라이언트를 파악한다.
4. 쿠키는 서버 - 클라이언트 간의 지속적인 데이터 교환을 위해 만들어졌다.

로컬스토리지 ( Local storage)

데이터의 만료기간이 없으며 사용자가 데이터를 지우지 않은 한 영구적으로 보존된다. 사이트 재 방문시 이전에 저장되었던 정보를 이용 할 수 있어 활용도가 높다.
사용자 설정 저장, 브라우저를 닫고 열었음에도 정보가 남아야 하는 것들을 저장할 때 사용한다.

profile
프론트엔드 공부중

0개의 댓글