localStorage 사용방법

 

사이트 유지보수 작업중

현재시간을 계속해서 갱신해서 저장을 해야되는 작업이 필요하여

어떤 방식으로 처리를 하는게 좋을까 생각하던중에

쿠키나 세션 방식의 저장이 아닌 localStorage를 사용하는 방법을 선택해 보았습니다.

 

오래전에 사용해보고 오랜만에 사용할려니 기억이 안나서 google 검색 후 작업 진행했습니다.

 

먼저 localStorage는 브라우저에 key 와 value 값을 저장할 수 있습니다.

저장된 데이터는 브라우저세션간에 공유가 되지만 페이지 프로토콜별로는 구분이 된다고 합니다.

 

localStorage를 사용하기 위해서는 몇가지 명령만 알면 사용이 가능합니다.

 

추가 : setItem()

읽기 : getItem()

제거 : removeItem()

전체삭제 : clear()

 

간단하게 사용하는 예시

 

// mykey 키에 sonsoo 값을 저장
window.localStorage.setItem('mykey', 'sonsoo');

// mykey 키에 저장된 값을 불러옴
let mydata = window.localStorage.getItem('mykey');
document.write(mydata); // sonsoo 출력

// mykey 키에 저장된 값을 삭제
window.localStorage.removeItem('mykey');
let mydata2 = window.localStorage.getItem('mykey');
document.write(mydata2); // 출력 안됨

// localStorage 에 저장된 모든정보 삭제
window.localStorage.clear();

 

현재시간 갱신위해 이번에 사용한 간단한 예시입니다.

let nowDate = new Date();

let nowTimeStamp = nowDate.getTime();

window.localStorage.setItem('nowTime', nowTimeStamp);