[FE] WebStorage 기초

웹의 취약점 (state less)

  • 페이지가 이동할 때마다 상태 정보는 모두 사라진다.
  • a라는 페이지에서 사용했던 정보들(변수, 객체 등)이 b페이지로 이동하면 모두 사라진다. 만약 필요하다면 get, post 방식으로 값들을 하나하나 넘겨야 하는 번거로움이 있다.
  • 그래서 정보의 영속성을 유지하기 위한 저장 매커니즘이 필요하다
    1. 클라이언트 쪽에 저장하는 기술: 단점 - 사용자가 직접 삭제, 보기가 가능하다
      • Cookie
        • 용량의 제한과 개수의 제한
        • 사용자의 요청(request)이 될때마다 서버로 쿠키를 매번 전송한다.
        • ex. id 기억시키기, 사용자 트렌드 분석
      • HTML5에서 지원하는 WebStorage: 브라우저가 가지고 있는 저장소에 저장되는 것
        1. localStorage: 만료기간이 없이 삭제하지 않으면 평생 유지된다.
        2. sessionStorage: 세션이 유지되는 동안에만 정보가 유지된다.
          • session이란 개념은 브라우저가 start해서 stop(완전히 종료)할 때까지 유지
    2. WAS쪽에 저장하는 기술
      • pageContext
      • request
      • session
      • application