이번에 MERN 스택으로 이미그레이션한 유튜브 클론프로젝트를 Netlify, Heroku로 각각 프론트엔드와 서버를 배포했다. (DB는 이전에 사용했던 MongoDB Atlas를 그대로 사용했다.)
그런데 development mode에서는 정상적으로 작동하던 session이 heroku로 배포되면서 제대로 유저 정보를 저장하지 못하기 시작했다. (참고로 세션은 MongoDB Atlas를 통해 persist하고 있었는데 DB에는 제대로 session이 저장되어 있었다. 따라서 DB와의 커넥션 문제는 아니다.)
해결 방법은 다음과 같이 express-session 미들웨어의 config를 설정해주면 된다.
"proxy : true"에 대한 멘션은 정말 많은 검색을 해도 잘 나오지 않았는데 Heroku 혹은 Digital Ocean을 통해 Deploy를 진행하면 필요하다고 한다. (참고 링크) 물론 cookie와 관련된 설정들도 필요하다. 만약 나처럼 Frontend와 Server을 서로 다른 환경에 Deploy하게 된다면 Cross Domain 이슈로 인해 쿠키를 제대로 유지하지 못하는 문제가 생긴다. 따라서 서로 다른 도메인 환경에서도 cookie를 사용할 수 있도록 sameSite 옵션에 none 값을 지정해준다. 또한 HTTPS 환경에서 쿠키를 처리하기 위해 secure을 true값으로 지정해준다. 만약 개발 모드라면 HTTPS를 이용하지 않으므로 secure을 true로 지정해주면 안 된다. 나 같은 경우에는 이미 개발을 다 마치고 배포를 하는 상태에서 해당 값을 상태해서 그냥 true를 넣어주었지만 개발을 진행하는 단계라면 process.env.NODE_ENV를 통해 production 모드인 경우 true, 그렇지 않은 경우 false를 지정해주면 될 것이다.