LocalStorage와 sessionStorage의 차이점

localStorage와 sessionStorage는 브라우저에서 제공하는 클라이언트 측 저장소 API이다.
둘 다 데이터를 키-값 쌍 형태로 저장한다.

---

localStorage와 sessionStorage의 차이점

1. 데이터의 지속성과 범위

• localStorage: 데이터를 영구적으로 저장한다.
  • 브라우저를 닫거나 장치를 재부팅해도 데이터가 유지되고, 동일한 도메인 내의 모든 탭에서 데이터를 공유할 수 있다.
  • 사용 예: 다크모드 같은 테마 설정, 장바구니 데이터 등 장기적으로 유지해야 하는 데이터 저장에 적합하다.
• sessionStorage: 데이터가 현재 브라우저 세션 동안만 유지된다.
  • 브라우저 탭이나 창을 닫으면 데이터가 삭제된다.
  • 또한, 같은 도메인이라도 탭 간에 데이터를 공유하지 않는다.
  • 사용 예: 로그인 후 인증 데이터를 일시적으로 저장하거나, 특정 탭에서만 사용할 데이터를 관리하는 데 적합하다.

---

결론

• localStorage: 장기 데이터 저장에 적합하다.
• sessionStorage: 탭 단위로 데이터를 관리하거나 일시적인 데이터 저장에 적합하다.

---

localStorage와 sessionStorage 사용 시 문제점

localStorage와 sessionStorage 모두 보안 관점에서 주의가 필요하다.

1. localStorage의 보안 문제

• 민감한 데이터를 localStorage에 저장하면 영구적으로 유지되므로 보안 위험이 크다.

2. sessionStorage의 보안 문제

• sessionStorage는 세션 종료 시 데이터가 자동으로 삭제되므로 민감한 데이터를 임시 저장하는 데 더 적합하지만, 여전히 보안적인 문제가 남아 있다.

---

스토리지 사용 시 보안 문제 해결 방법

브라우저 저장소는 데이터를 암호화하거나 보호할 기본적인 방법을 제공하지 않으므로, 아래와 같은 원칙을 따르는 것이 중요하다:

1. 민감한 데이터를 스토리지에 저장하지 않는다.

   • 가장 직관적이고 안전한 방법이다.

2. HTTP-Only 쿠키를 사용한다.

   • 인증 토큰이나 사용자 비밀번호는 localStorage 또는 sessionStorage에 저장하지 않고, HTTP-Only 쿠키를 활용한다.
   • 이렇게 하면 자바스크립트에서 접근할 수 없으므로 XSS(교차 사이트 스크립팅) 공격에 대한 위험을 줄일 수 있다.