배포 후, refreshToken 문제

Question

안녕하세요! 현재 프론트앤드, 백엔드 강의를 들으며 포트폴리오를 진행하고 있고, 백엔드는 배포까지 완료하였습니다. 백엔드 배포후, 프론트앤드에서 백엔드api주소를 배포된 주소로 변경하였는데 refresh token이 쿠키에 저장되지 않아 자꾸 에러가 납니다ㅠㅠ배포 전 localhos t에선 문제없이 작동되었는데 배포된후엔 왜 문제가 될까요?? (apollo/index.tsx) (getAccessToken.ts) (useAuth.tsx) (main.ts)

노원두 · Answer

안녕하세요! HayoungPark 님! 실 배포시에는, 현재 localhost 와 backend.amberpark.net 사이트가 다르므로 SameSite=None 옵션을 주셔야해요! 추가로, 여기서 SameSite=None 인 경우에는 서로다른 두 사이트간의 쿠키 전송이므로 보안상 취약할 수 있어 Secure 옵션 을 주셔야 된답니다!. Secure옵션상에서 작동하려면 반드시 https 여야합니다!^^ (* 추가로, javascript로 제어를 불가능하도록 하여 httpOnly옵션도 함께 주시는게 일반적입니다!) 최종적인 결과로는 refreshtoken발급시 아래 부분을 수정 해 주세요! // 어떤 오리진을 허락할지 context.res.setHeader('Access-Control-Allow-Origin', 'localhost') // 쿠키 상세 설정 context.res.setHeader('set-Cookie', `refreshToken=${refreshToken}; path=/; domain=.amberpark.net; SameSite=None; Secure; httpOnly;`)