Web Storage - Session storage vs Local storage

프론트 개발을 하면서 느낀 점이 있다.

데이터 베이스나 클라우드가 없으면 데이터를 저장하기 굉장히 난감하다는 것 …

실제로 얀센에서 파트타임을 하면서 그 쪽에서 요구했던 점이 접속하는 사용자의 단순 정보를 담고 있어줄 수 있냐는 것이었다.

하지만 얀센에서 사용했던 MS Sharepoint 툴에서는 서버를 사용할 수 없으니 안될 것 같다고 했었지만… 생각해보니 웹 스토리지가 있었다.

 

 

이렇게 데이터가 노출이나 유실에 예민하지 않은 성격이라면 서버보다는 클라이언트에 담을 수 있다.

하지만 이에도 한계가 있는데, 저장하는 데이터 타입이 string 만 가능하다는 점이다. 이를 극복하는 방법은 JSON 형태로 저장하는 것이다. JSON의 stringify함수로 데이터를 직렬화 해준다음, 읽을 때는 parse함수로 역직렬화를 시켜주면 원본 데이터를 그대로 얻을 수 있다.

다음 데이터를 저장하는 방법들에는 저장할 수 있는 기간에 차이가 있는데, 우선 종류에는 로컬스토리지(local storage)와 세션스토리지(session storage)가 존재한다.

 

Session Storage

세션스토리지는 웹페이지의 세션이 끝나면 스토리지에 있는 데이터가 소멸됩니다. 즉, 웹 페이지의 탭 혹은 창이 닫히면 데이터는 사라져버린다는 것입니다. 그리고 페이지를 여러 탭을 띄우게 되면 각 탭 마다 데이터는 따로 존재합니다. 즉, A,B,C 3개의 웹 페이지를 실행하고 있다고 하면 3개의 세션 스토리지가 따로 작동한다는 것 입니다.

Local Storage

로컬 스토리지는 웹 페이지의 세션이 끝나도 데이터가 지워지지 않는 영속성을 지닙니다. 탭을 닫으면 사라지는 세션 스토리지와 달리 로컬 스토리지는 탭을 닫아도 소멸되지 않고 다시 탭을 열면 그대로 보존되어있다는 것입니다. 또한 여러 탭 간에 데이터가 서로 공유 됩니다.

하지만 이런 로컬 스토리지에도 한계가 있습니다. 여러 탭간에 스토리지가 공유되는 장점은 동일한 컴퓨터, 동일한 브라우저를 사용할 때만 해당된다는 점입니다. 이런 한계를 극복하고 싶다면 DB 서버나 클라우드 서버가 필요한 것입니다.