1. 상황

• 기존에 리덕스 툴킷을 사용하던 상황이라 rtk-query를 이용하면 비동기 통신을 손쉽게 할 수 있다는 정보취득. (리덕스 사가를 사용하기에는 비동기통신 성공, 실패, 로딩중 코드를 쓰기가 너무 길다. 그리고 rtk-query는 baseUrl을 기반으로 확장성이 좋아보였음. 어차피 앞으로 비동기 통신할일은 많으니)
• passport.js와 react.js,rtk-query를 사용해서 카카오 로그인을 구현.
• 처음 렌더링시 로그인 유무를 확인후 헤더를 다르게 보여주기 위한기능 구현시도.
• passport를 이용해서 카카오 로그인 전략을 수행후 로그인상태에서 클라이언트에서 백엔드로 유저정보를 요청하는 라우터 작성.
• req.user가 분명히 클라이언트에 돌아와야함에도 undefined 출력.

2. 해결노력

• rtk-query를 사용하지않고 axios를 사용하여 다시구현
• rtk-query에서 보내는 헤더를 새로만들어봄
• 백엔드단의 코드 한줄한줄마다 console찍어봄(로그인 전략은 아주 잘 수행되는데 내가 별도로 작성한 유저정보를 요청하는 라우터가 작동을 안함)
• rtk-query에선 쿠키를 어떻게 다루는지 검색

3. 정답

• rtk-query는 내부적으로 axios가 아닌 fetch를 사용함
• 요청헤더에 쿠키를 포함시켜야 백엔드에서 쿠키를통해 세션에서 정보를 찾아서 사용자 정보를 가져 올 수 있음
• 따라서 프론트단에서 요청을 보낼때 credentials: 'include' 추가해야함(물론 백엔드단의 cors는 해결되어있다는 전제하에)
  

4. 느낀점

• 이렇게 간단한 문제인데.. 5일이나 걸렸다. 저 위에적은 해결노력말고도 정말 잡다하게 많이했다. 구글링도 많이했고.. 이게 5일이나 걸릴일인가 참 암담하다. 앞으론 문제해결시간을 좀 단축시키고싶다. 그리고 프로젝트 진행중에 "참 이해 할 수가없다"싶은 문제의 절반은 cors문제인것 같기도 하다.