😮‍💨문제

• 로그아웃 버튼을 한번만 클릭하면 로그아웃이 완료되어야하는데 더블클릭해야 로그아웃이 된다.
  
  참고로 우측 주황색버튼이 로그아웃 버튼이다.

router.post("/kakao/logout", async (req, res) => {
  try {
    const ACCESS_TOKEN = res.locals.user.accessToken;
    console.log("로그아웃 라우터에서 req.user", req.user);
    console.log("로그아웃 라우터에서 엑세스 토큰 찍어봄", ACCESS_TOKEN);
    await axios({
      method: "post",
      url: "https://kapi.kakao.com/v1/user/logout",
      headers: {
        Authorization: `Bearer ${ACCESS_TOKEN}`,
      },
    });
    req.logout(() => {
      req.session.destroy(() => {
        res.clearCookie("connect.sid");
       
      });
    });
  } catch (error) {
    console.error(error);
    res.json(error);
  }
});

이것이 나의 카카오 로그아웃 코드이다

🤯고뇌의 시간

• 클릭했을때 네트워크 요청을 보니 logout요청이 가긴하지만 대기상태임
• 리덕스 데브툴스를 통해 사용자 정보가 삭제되는지 확인(삭제됨)
• 콘솔창에 에러가 나는지 확인(에러는 나지않음)
• 세션쿠키가 삭제되는지 확인(두번클릭을해서 로그아웃상태가 되더라도 세션쿠키가 삭제되지않음. 물론 한번클릭했을때 또한 어림도 없지)
• 아마 한번 클릭했을땐 요청이 완료되지않아서 대기상태이지 않을까싶음

😳정답

• 기존에는 res.end로 요청을 종료해주지 않았지만 res.end() 로 응답을 종료해주었더니
  단일클릭만으로 요청과 응답 그리고 결과가 제대로 도출되었다. 그리고 세션쿠키 또한 삭제가 되었다.
  res.end를 해주지않아서 서버입장에선 응답이 종료인건지 알 수 없기때문에 일어난 문제가 아닐까 싶다.