YAPP-Github / 21st-Web-Team-2-FE

Thumbs up 👍
https://www.thumbs-up.me
Apache License 2.0
6 stars 3 forks source link

[fix] SSR에서는 투표 여부 반영 안되는 문제 해결 #150

Closed hwookim closed 1 year ago

hwookim commented 1 year ago

💡 목적

스크린샷 2023-02-21 오전 2 20 35 스크린샷 2023-02-21 오전 2 20 46

📝 Todo

‼️ 주의 사항

hwookim commented 1 year ago

getServerSideProps 에서는 interceptor로 header에 넣던 authorization이 없어서 생기는 문제였습니다.

현재 떠오르는 해결 방법은

  1. 전부 client-side로 변경하기
  2. cookie를 이용하면 모든 요청에 들어가니 context에 접근해서 getServerSideProps에서는 header에 직접 넣기
  3. next auth 사용하기

가 있긴 한데 조금만 더 고민해보도록 하겠습니다. @KIMSEUNGGYU 승규님도 한 번 같이 고민해주시면 감사하겠습니다 ㅠㅠ

KIMSEUNGGYU commented 1 year ago

음.. 저희가 토큰을 로컬스토리지로 관리해서 gerServerSideProps 에 접근이 아마 불가능할거 같은데 맞을까요?? 만약 그렇다면 쿠키로 전환해야할거 같네여!

제가 인증 관련 구현할때 그 과정을 잘모르고 next-auth 는 자체적으로 관리하는거 같아서(우리는 초기 auth-code 만 사용하지만 next-auth 는 auth-code 및 jwt 를 구글과 통신해서 처리한다는 느낌을 받아서 해당 라이브러리 사용하지 않았는데 (저희는 auth-code 받고 저희 서버랑 통신해야함) 이제 전체적인 플로우도 알았으니 해당 라이브러리에서 저희가 원하는 동작을 제어할 수 있는지 찾아보겠습니다! 만약에 현우님이 생각나신 플로우가 있다면 공유해주셔도 좋을 거 같아요!!

그래서 근본적인 문제 해결책은.. 아마 쿠키로 http only 방식으로 통신해야하지 않을까? 라는 생각이 듭니다.

발표전까지 좀 더 완벽한 것을 원하면 우선 CSR 로 변경하고 후에 다시 제대로 통신되도록 변경해야할 거 같네요ㅠㅠㅠ

아마 localstorage 에 접근 가능하다면 HoC 로 getServerSideProps 로 token 통신이 필요한 곳에서 사용할 수 있도록 하면 되겠구나 생각했는데 아마 localstorage 에 접근이 불가능할 거 같습니다..

전혀 예상치 못한 버그라 고생이십니다! 저도 더 좋은 방법 생각나면 Comment 달겠습니다.