[TIL] 쿠키에 토큰 저장 / 삭제

프로젝트에서 항상 스토리지나 세션에 저장하다가 쿠키에도 저장하는 법을 알기 위해 쿠키에 저장하고 읽어 오고 삭제하는 방법을 찾았다.

쿠키 저장

const setCookie = (name, value, days) => {
  const expires = new Date();
  expires.setTime(expires.getTime() + days * 24 * 60 * 60 * 1000);
  document.cookie = `${name}=${value};expires=${expires.toUTCString()};path=/`;
};

쿠키 읽기

const getCookie = (name) => {
  const value = `Bearer ${document.cookie}`;

  const parts = value.split(`Bearer ${name}=`);

  if (parts.length === 2) {
    return parts.pop().split("Bearer ").shift().trim();
  }

  return undefined;
};

로그인에 성공하면 쿠키 저장

const response = await axiosInstance.post("/api/user/login", userInfo);

      if (response.data.success) {
        alert(`환영합니다.`);
        const accessToken = response.data.accessToken;
        setCookie("accessToken", accessToken, 1);
        window.location.href = "/views/main.html";
      }

로그아웃 버튼 누르면 쿠키 삭제

const deleteCookie = (name) => {
  document.cookie = `${name}=;expires=Thu, 01 Jan 1970 00:00:00 UTC;path=/;`;
};

const logout = () => {
  deleteCookie("accessToken");

  alert("로그아웃 되었습니다.");

  window.location.reload();
};