이 기사는 Faith Chikwekwe님의 글을 번역한 것입니다.
번역이 이상한 곳이나 오타를 알려주시면 감사하겠습니다.
긴 시간동안 cookies는 당신의 앱 또는 웹사이트를 방문하는 유저들에 대한 정보를 저장하는 주된 방법이었습니다. cookies들은 쇼핑 카트 항목들 또는 유저에 의해 변경된 옵션같은 상태를 기록하는데 사용되었습니다. 그리고 유저가 검색한 것을 기억하거나 페이지 간 이동했을때 로그인 상태를 유지하는데에 사용되었습니다. 그러다가 HTML5가 등장했고 LocalStorage를 다른 데이터 저장 옵션으로 도입했습니다.
새로운 Javascript 객체 (SessionStorage와 LocalStorage)는 5MB의 객체보다 더 많은 저장 용량을 자랑합니다.
이 기사에서는 cookies와 LocalStorage를 비교하고 대조합니다.
Cookies — 작지만 강력하다
먼저, 우리는 Cookies에 대한 기본 정보를 살펴보겠습니다. 그리고 Cookies의 장단점을 살펴볼 것입니다. 그럼, Cookies는 무엇일까요? whatarecookies.com 에 의하면 웹사이트에 의해 유저의 컴퓨터에 놓여지는 작은 텍스트 파일들입니다. Cookies는 최대 4KB의 용량을 가진 매우 작은 양의 데이터입니다. Cookies는 사이트에서 방문한 페이지를 저장하거나 유저의 로그인 정보를 저장하는 등 다양한 방법으로 사용됩니다. 그리고 문자열만 저장할 수 있다는 제한이 있습니다.
많은 보안 웹사이트들은 로그인을 한 후 Cookies를 사용해 유저의 신원을 확인하여 모든 페이지에서 재인증을 거치지않아도 되게 됩니다. Cookies의 또 다른 용도는 사이트에서 제한된 인터넷 사용 기록을 기반으로 사용자 경험을 개선하는 것입니다.
Cookies의 두 가지 유형
Cookies는 두 가지 유형이 있습니다. 바로 persistent cookies와 session cookies입니다.
Seesion cookies는 만료일을 포함하지 않습니다. 대신에 브라우저나 탭이 열려있는 동안에만 저장됩니다. 브라우저가 닫히면 cookies는 영구적으로 삭제됩니다. 이 유형의 cookies는 은행 웹사이트 내에서 작업을 하고 있다가 탭을 닫으면 모든 정보를 잊어버리기 때문에 은행 유저들의 자격 증명을 저장하는데 사용될 수 있습니다.
Persistent cookies는 만료일을 가집니다. 이 cookies는 만료일까지 유저의 디스크에 저장되고 만료일이 지나면 삭제됩니다. 유저들이 방문할때마다 유저 경험을 커스텀하기 위해 특정 웹사이트에서 행동을 기록하는 등 여러 활동들에 사용될 수 있습니다.
LocalStorage — 더욱 영구적인 솔루션
HTML5가 나온 이후, cookies의 많은 사용 방법들은 LocalStorage의 사용으로 대체되었습니다. LocalStorage는 cookies보다 더 많은 장점이 있기 때문입니다. 가장 중요한 차이점 중 하나는 cookies와는 달리모든 HTTP 요청에서 데이터를 주고받을 필요가 없다는 것입니다. HTTP 요청에서 데이터를 주고받지 않고 LocalStorage를 이용하면 클라이언트와 서버간의 전체 트래픽과 낭비되는 대역폭의 양을 줄일 수 있습니다.
데이터가 유저의 로컬 디스크에 저장되어 있으면 인터넷이 끊어져도 데이터가 삭제되거나 지워지지 않기 때문입니다.
또한 앞에서 언급했듯이 LocalStorage는 최대 5MB의 정보를 저장할 수 있습니다. 이것은 cookies가 보유할 수 있는 4KB보다 훨씬 더 많습니다.
LocalStorage의 만료 조건은 persistent cookies처럼 동작합니다. Javascript 코드를 통해 삭제하지 않으면 데이터는 자동으로 삭제되지 않습니다. 이 방식은더 오랜 시간동안 저장해야하는 큰 데이터에 유용합니다. 또한 LocalStorage를 사용하면 문자열 뿐만아니라 javascript의 primitives와 object도 저장할 수 있습니다.
LocalStorage의 사용
백엔드 웹 개발 과정에서 LocalStorage가 cookies보다 우수한 경우에 대해 논의했습니다. LocalStorage의 좋은 사용 예시는 인터넷 연결이 잘 유지되지 않는 지역에서 사용되는 애플리케이션일 수 있습니다. 저의 강의 강사인 Dani Roxberry는 과거에 이런 애플리케이션을 구축했었고 LocalStorage를 사용하여 WiFi 또는 데이터 연결이 약한 지역에서 수집된 데이터를 보호하고 저장하는데 사용했습니다.
LocalStorage를 잘 사용하려면 이 상황에 저장된 데이터의 위협 수준이 매우 낮아야합니다. 클라이언트의 개인정보를 보호하려면 다시 연결이 되었을때 데이터를 업로드한 다음 로컬에 저장된 버전을 삭제하는 것이 좋습니다. 추가적으로 쉽게 해킹되지 않도록 저장된 데이터를 암호화하는 것이 좋습니다.
이 수업에서 우리는 재무 정보와같은 매우 취약한 데이터를 LocalStorage를 사용해 제대로 저장하거나 보호할 수 없다는 것을 알아냈습니다.
결론
cookies는 더 작고 모든 HTTP 요청과함께 서버 정보를 다시 전달해주지만 LocalStorage는 더 크고 클라이언트 측에 정보를 보유할 수 있습니다.
다음 애플리케이션을 만들때에는 이런 다양한 용도에 대해 생각해보고 자신에게 더 적합한 스토리지 유형을 결정해보세요.
