HTML Web Storage

로컬스토리지 : 사용자 pc에 직접 저장됨

<script>
  // Store a value in local storage
  localStorage.setItem("key", "value");

  // Retrieve a value from local storage
  var storedValue = localStorage.getItem("key");
  console.log(storedValue); // "value"
</script>

이 예에서는 setItem() 메서드를 사용하여 로컬 저장소에 키-값 쌍을 저장하고 getItem() 메서드를 사용하여 키와 관련된 값을 검색한다.

세션스토리지 : 브라우저 단일세션에 저장

<script>
  // Store a value in session storage
  sessionStorage.setItem("key", "value");

  // Retrieve a value from session storage
  var storedValue = sessionStorage.getItem("key");
  console.log(storedValue); // "value"
</script>

웹 스토리지 API는 특정 키-값 쌍을 삭제하는 removeItem(), 저장소의 모든 키-값 쌍을 삭제하는 clear(), 인덱스를 통해 키를 검색하는 key()와 같은 다른 방법을 제공한다.

또한 웹 스토리지에는 일반적으로 5-10MB 정도의 제한이 있으며 저장된 데이터는 XSS 공격에 취약하므로 스토리지에서 저장 및 검색되는 모든 데이터의 유효성을 제대로 검사해야 한다.