본문 바로가기
01_PROJECT/OBJECT _2023

[ JavaScript ] Session Storage와 Local Storage, 어떤 걸 어떻게 쓸까?

by zestlumen 2023. 7. 27.

Session Storage 세션스토리지

- 세션에 대한 유지 기가 동안 데이터를 저장하는 데 사용한다.

- 브라우저 탭이나 창을 닫으면 저장된 세션 스토리지의 저장된 데이터가 삭제된다.

- 다른 탭이나 창에서는 세션 스토리지에 접근할 수 없다.

- 보안적인 측면에서 더 안전한 옵션이지만, 재부팅이나 브라우저 종료 시 데이터가 손실된다.

 

Local Storage 로컬스토리지

- 영구적으로 데이터를 저장하는 데 사용된다.

- 사용자가 명시적으로 데이터를 삭제하지 않는 이상, 브라우저를 닫아도 데이터가 유지된다.

- 다른 탭이나 창에서도 로컬 스토리지에 접근할 수 있다.

- 보안에 주의해야 한다.

 

로그인 아이디와 같은 중요한 정보는 일시적인 세션에 저장하는 것이 보안적인 측면에 더 안전하다.

로그인 상태를 유지하는 경우에는 세션 스토리지에 사용하는 것이 적합할 수 있다.

하지만 로그인 정보를 영구적으로 저장하고자 할 때는 로컬스토리지를 사용할 수도 있다.

이 경우에는 보안을 신경쓰고, 데이터를 암호화하야 저장하는 등의 추가적인 보안 조치를 취해야 한다. 

 


 

그래서 오브젝트 v2에서는 로그인 아이디, 멤버십 정보, 유저 정보 관련해서는 세션스토리지에 담고,

파이어베이스에서 받아온 유저 이미지는 누가 가입해도 이미지 4개가 동일하기 때문에

로그인마다 파이어베이스 스토리지에서 계속 받아오는 것보다

처음에 로그인 시에 로컬스토리지에 담아 놓는게 나을 것 같아 로컬에 담았다.

 

 

 

영화 이미지 포스터도 파이어베이스 스토리지에 담고, 로컬에 담는 방법을 쓰고 싶었는데

파이어베이스 스토리지 무료 용량이 가득차서 할 수 없었다.. 이에 관해서는 또 포스팅을 올릴 예정이다.