본문 바로가기
Javascript

[javascript] 로컬스토리지 란?

by thecorative 2023. 1. 30.
반응형

 

// 데이터 저장하기 localStorage.setItem(key, value);

// 데이터 불러오기 localStorage.getItem(key);

// 데이터 삭제 localStorage.removeItem(key)

// 모든 것 삭제 localStorage.clear()

//index에 해당하는 키 소환 localStorage.key(index)

// 저장된 항목의 수 localStorage.length

 

로컬스토리지 활용 케이스 

회사에서 관리자 페이지를 만들어야되는 작업이 있었다. 

특정 data를 보내야 필요한 자료를 보내주는 작업

 

axios 에서 post 요청을 하는데 apiUrl 과 요청할 자료를 보내고 

서버에서 응답을 받는 작업이었다. 

 

로그인해야만 얻을수 있는 자료들을 localStroage에 저장하고 

그데이터를 불러와서 post요청하는 방식의 작업을 하면서 localStroage를

활용하는 방법을 배울수 있었다.

 

주로 사용한 것은

// 데이터 저장하기 localStorage.setItem(key, value);

// 데이터 불러오기 localStorage.getItem(key); 

// 모든 것 삭제 localStorage.clear() -> 로그아웃시 모든 데이터를 날려야될때 사용

 

**example

localStorage.getItem(id)

let apiRequest = {
data: {
id: id,
},
};

const _response = await axios.post(apiUrl + "ㅇㅇㅇ", apiRequest, {
withCredentials: true,
});
반응형