2. 트러블 슈팅 -소셜 로그인 OAuth 2.0-

이번 문제는 소셜 로그인 구현 과정에서 발생한 로직 문제이다.

Passport의 사용이 이번이 처음이다 보니 문서를 참고해서 작성했다.

 

초기 로직 구현의 순서는 다음과 같다.

login API 호출 -> 네이버 서버로부터 Code 받아오기 -> Code 재검증 -> 유저 정보 받아오기(Payload) -> 로그인/회원가입 및 AccessToken / RefreshToken 발급

백엔드 로컬 서버에서 API를 실행했을 때는 문제 없이 토큰 발급이 가능했으나, 문제를 확인한 시점은 프론트 코드 작성 후 백엔드 서버와 연결해서 테스트 할때 발생했다. CORS 에러 였다.

 

현재 프로젝트는 프론트 서버와 백엔드 서버를 분리해서 개발하고 있었기 때문에, 백엔드에서 위의 로직을 전부 다 구현하는 것은 불가능했다.(callback 사용)

 

따라서 해결한 방법은 다음과 같다.(핀터레스트 클론 코딩 때와 같은 방식 이었다.)

프론트 : Login 요청 -> 네이버 서버로 부터 Code 발급
백엔드 : 프론트로 부터 Code를 쿼리 스트링으로 받음 -> 네이버 서버로부터 Code 인증 -> 유저 정보 가져옴(Payload) -> 로그인 / 회원가입 진행 -> 토큰 발급