리액트-스프링부트 OpenID Connection 방식으로 로그인 시 프론트에서 백엔드로 인가코드 넘겨줄 필요가 없나요?

JavaScript
1

개발환경 : react next js
key : rest api key 사용
디벨로퍼스 앱 ID : 949673

우선 저는 Javascript sdk를 사용하지 않고 RestAPI 방식으로 진행중입니다.
백엔드 분이 아래 문서를 보고 로그인 작업을 하셨다 하셨습니다.
https://developers.kakao.com/docs/latest/ko/kakaologin/js
( Kakao.Auth.authorize() 를 했을 때 사용 중이던 서비스로 이동하여
로그인을 완료해 주세요. 라는 문구가 나와 RestAPI로 진행중입니다)
OIDC 방식으로 로그인을 구현하셨기 때문에 인가코드를 넘겨줄 필요가 없다고 하십니다. 하지만 RestAPI,Javascript SDK모두 인가코드를 발급해주고 그걸 서버에 보내서 서버에서 [POST] https://kauth.kakao.com/oauth/token 를 호출해 id토큰을 저한테 넘겨서 그걸로 인증하는 방식이 맞다고 생각하는데 왜 OIDC방식에서는 인가코드가 필요 없는지 궁금합니다.

2

OIDC 방식으로 로그인을 구현하셨기 때문에 인가코드를 넘겨줄 필요가 없다고 하십니다.
OIDC방식에서는 인가코드가 필요 없는지 궁금합니다.

어떤 상황인지 잘 이해하지 못했습니다.

카카오 로그인은 Kakao.Auth.authorize() 방식, RestAPI 방식 둘중 어떤 방식을 사용하던간에
리다이렉트 URI로 인가코드를 전달하고 인가코드로 액세스 토큰을 발급 받아야합니다.
OIDC 설정을 활성화하면 액세스 토큰 발급 시, 응답에 id_token이 추가 전달될 뿐입니다.

'인가코드를 넘겨줄 필요가 없다’는 어디서 제공된 내용인가요? 다른 맥락에서 전달받으신 내용아닐까요?

3

이 부분은 window.Kakao.Auth.authorize({ redirectUri: REDIRECT_URI, scope: 'account_email,openid', }); 이런식으로 해결해서 코드를 잘 받아냈습니다! 현재 Redircet URI missmatch가 뜨는데 혹시 확인 가능할까요? 프론트,백엔드 모두 localhost:3000/login/kakao 로 설정했는데 미스매치가 뜹니다! 앱 ID : 949673입니다!

4

아래와 같이 서로 다르게 전달되었습니다.

인가코드: http://localhost:3000/login/kakao
접근토큰: http://localhost:3000/login/kakao/v1/auth/kakao/redirect-uri

인가코드: https://trunkr.co.kr/v1/auth/kakao/redirect-uri
접근토큰: http://localhost:3000/login/kakao/v1/auth/kakao/redirect-uri
5

정말 감사합니다!

1개의 좋아요