[Web] LocalStorage, SessionStorage, Cookie의 차이

Frontend

silver님 2024. 9. 27. 14:44

LocalStorage, SessionStorage, Cookie의 차이

LocalStorage는 도메인에 대하여 같은 정보를 저장하며, 창을 닫거나 탭을 닫는 등 세션이 만료되어도 정보가 지워지지 않는다.

범위 : 동일 도메인 내에서 모든 창과 탭에 걸쳐 데이터를 공유한다.

즉, 동일한 웹사이트라면 여러 개의 탭에서 접근한 경우에도 동일한 데이터를 읽고 쓸 수 있다.

지속성 : 브라우저를 닫거나 시스템을 재부팅하더라도 데이터가 사라지지 않는다.

명시적으로 삭제하기 전까지는 무기한으로 유지된다.

데이터 용량: 일반적으로 5MB정도 용량을 지원하며, 이 제한은 브라우저마다 다를 수 있다.

보안성 : LocalStorage에 저장된 데이터는 클라이언트 측에서 쉽게 접근 가능하므로, 민감한 정보 저장에 적합하지 않다.

데이터는 암호화되지 않으며, JavaScript 코드로 접근할 수 있다.

SessionStorage는 같은 도메인이더라도 탭, 창 별로 서로 다른 정보를 저장하며, 세션이 만료되면 데이터도 함께 사라진다.

범위 : 동일 도메인 내에서도 각 탭과 창이 독립된 공간을 갖는다. 즉, 탭 A에서 저장된 정보는 탭 B에서 접근할 수 없다.

지속성 : 세션이 만료되면 (예 : 브라우저 탭을 닫거나 페이지를 새로 고침하면) 데이터는 사라진다.

따라서, 일시적인 데이터 저장에 적합하다.

데이터 용량 : LocalStorage와 비슷하게 5MB 정도의 용량을 지원하지만, 일시적인 데이터를 저장할 때 사용된다.

보안성 : LocalStorage와 마찬가지로 데이터는 클라이언트 측에 저장되며,

암호화되지 않기 때문에 민감한 데이터 저장에는 적합하지 않다.

Cookie는 용량이 상당히 작은 텍스트 파일로, 만료 기간을 가져 일정 시간이 지나면 만료되어 데이터가 삭제된다.

범위 : 서버와 클라이언트 간의 작은 데이터 조각을 주고 받는 방식으로, 쿠키는 특정 도메인에만 적용되며 요청마다 서버로 전송된다.

지속성 : 쿠키는 만료 기간을 설정할 수 있으며, 기간이 지나면 자동으로 삭제된다.

세션 쿠키는 브라우저가 닫히면 삭제되며, 영구 쿠키는 지정된 기간 동안 유지된다.

데이터 용량 : 쿠키는 4KB 정도의 작은 용량을 지원하므로, 대량의 데이터를 저장하기에는 적합하지 않다.

보안성 : 쿠키는 클라이언트 측에 저장되며, 쉽게 접근할 수 있으므로 보안에 취약할 수 있다.

따라서 민감한 정보는 암호화해서 저장해야한다. 또한, 쿠키는 매번 서버로 전송되기 때문에 성능에도 영향을 줄 수 있다.

LocalStorages는 긴 시간 동안 유지해야하는 정보 (예 : 사용자 설정, 다크모드 여부 등)을 저장할 때 유용하다.

SessionStorage는 한 번의 방문 동안만 유효한 데이터를 저장할 때 적합하다.

Cookie는 서버와 클라이언트 간의 데이터 교환이 필요할 때 (예: 사용자 인증 정보 저장) 주로 사용된다.

728x90