쿠키를 이용하여 데이터 저장하기/가져오기

데이터 저장하기

쿠키저장할때는 함수를 만들어서 사용하는게 편하다.

 const setCookie = (key, value, expiredDays) => {
   // 자동 삭제 날짜를 지정하는 코드
    let today = new Date();
    today.setDate(today.getDate() + expiredDays);
   // 쿠키에 값을 저장
    document.cookie =
      key +
      '=' +
      JSON.stringify(value) +
      '; path=/; expires=' +
      today.toGMTString() +
      ';';
  };

데이터를 가져오기

const getCookie = (key) => {
//쿠키는 한번에 모두 불러와지기 때문에 사용할때 ';'나눠서 선택적으로 가져와야한다.
  const cookies = document.cookie.split(`; `).map((el) => el.split('='));
  let getItem = [];

  for (let i = 0; i < cookies.length; i++) {
    // 해당하는 key를 갖는 쿠키데이터를 찾기위해 반복문을 사용했는데 다른방법도 연구해봐야겠다.
    if (cookies[i][0] === key) {
      getItem.push(cookies[i][1]);
      break;
    }
  }

  if (getItem.length > 0) {
    return JSON.parse(getItem[0]);
  }
};

위에서 쿠키를 저장할때 제이슨 형식을 사용했다. encodeURIComponent / decodeURIComponent를 사용하는 경우가 더많다. 이부분은 다시 알아보도록 하겠다.