[질문] localStorage.removeItem("key") 로그아웃 관련

[2wisdom]

localStorage.removeItem("key") 로 로그아웃기능 구현 시

처음 로그인 했을 때는 헤더에 Bearer token이 잘 입력되지만, 로그아웃 후 다시 로그인했을 때 Bearer null 이 뜹니다.

다들 어떤식으로 로그아웃 기능 하셨는지 궁금합니다 !

[young-st511]

저도 로그아웃은 removeItem으로 했습니다! 2wisdom님 코드 잠깐 봤는데 API 요청 때마다 localStorage에서 토큰 값을 받는거 같더라구요..! 로그인 때나 새로고침 했을 때 default header로 설정해놓는것은 어떨까요?!

[Yoon-Hae-Min]

로그인의 응답 값으로 토큰을 받고 그 토큰을 localStorage에 저장하는 것이니 로그인 요청 헤더에는 토큰이 없는게 맞는것이 아닌가 생각해 봅니다 :)

[2wisdom]

저도 로그아웃은 removeItem으로 했습니다! 2wisdom님 코드 잠깐 봤는데 API 요청 때마다 localStorage에서 토큰 값을 받는거 같더라구요..! 로그인 때나 새로고침 했을 때 default header로 설정해놓는것은 어떨까요?!

...
const AUTH_TOKEN = localStorage.getItem("Token");
axios.defaults.headers.common["Authorization"] = AUTH_TOKEN;
...

  return axios.post(serverUrl + endpoint, bodyData, {
    headers: {
      "Content-Type": "application/json",
      Authorization: `Bearer ${AUTH_TOKEN}`,
    },
...
  });

말씀해주신것처럼 default header 찾아아보니까 axios 공식 홈페이지에 저런식으로 지정해주라고 써있어서 해당 코드로 수정해보니까 로그아웃 후 다시 로그인 해도 정상적으로 헤더에 토큰이 담깁니다 !! 너무 감사해요 !! 🥰

[young-st511]

말씀해주신것처럼 default header 찾아아보니까 axios 공식 홈페이지에 저런식으로 지정해주라고 써있어서 해당 코드로 수정해보니까 로그아웃 후 다시 로그인 해도 정상적으로 헤더에 토큰이 담깁니다 !! 너무 감사해요 !! 🥰

앗 지금보니까 login 요청이었군요! login 요청에는 Authorization 헤더가 들어있지 않는게 맞을거 같습니다ㅎㅎ 로그아웃 했을 때 header에서 삭제하는 로직도 필요할 것 같습니다😊