안녕하세요. 워낙 문서도 잘 작성해주셨고, Dev Talk에서도 궁금한 점들을 많이 찾아볼 수 있었습니다.
그러나 계속해서 찾아 보았음에도 불구하고 문제를 해결할 수 없어서, 직접 문의를 드립니다.
프론트는 TypeScript를 사용하였고, 서버는 Spring를 사용했습니다.
현재 로직은 아래와 같습니다.
- 프론트에서 카카오계정 주소를 통해 인가코드를 가져옵니다.
여기서 redirect_uri는 프론트(localhost:3000)로 설정하였습니다. - 프론트로 redirect 되면, url에서 code를 파싱하여 서버의 API를 호출합니다.
- 서버는 인가코드를 받아 Access Token을 발급 받고, 카카오 API를 통해 사용자의 정보를 DB에 저장합니다.
- 저장 이후, 프론트에서 필요한 uid 값을 리턴합니다.
위 로직을 수행하면 서버 콘솔에서 https://kauth.kakao.com/oauth/token 400 에러가 발생합니다.
아무래도 프론트에서 받은 인가코드를 사용하여 Access Token을 발급받지 못하는 에러인 것 같습니다.
위 로직에서 1번의 redicert_uri를 서버(localhost:8080)로 설정하여 직접 인가코드를 받으면 에러가 발생하지 않고 정상적으로 굴러갑니다.
어디서 오류가 발생하는 지 모르겠습니다…
현재 프론트에서 API로 호출하고 있는 코드는 아래와 같습니다.
1번의 로직에서 redicert_uri를 아래 API로 지정하면 문제 없이 작동합니다.
@GetMapping("/oauth/redirect/kakao")
public ResponseEntity<?> kakaoCallback(@RequestParam("code") String code) throws Exception {
String access_Token = kakaoLoginService.getKaKaoAccessToken(code); // 여기서 400 발생
User user = kakaoLoginService.createKakaoUser(access_Token); // 여기서 401 발생
if(user.isSignUp()) { // user = null이라 에러 발생
final UserDetails userDetails = userDetailService.loadUserByUsername(user.getEmail());
final String token = jwtUtils.createToken(userDetails.getUsername(), user.getRoles());
return ResponseEntity.ok(new AuthenticationResponse(token, user.getRoles(), user.getUserId()));
}
return ResponseEntity.ok(user.getUserId());
}
앱 ID는 878739 입니다.
혹시나 서버의 redicert_uri를 사용하여 인가코드를 발급받고, 콜백 함수를 호출하는 API가 필요하시다면
연락처(이메일 등)를 알려시면 해당 메일로 발송 후 답글 드리겠습니다.
현재 테스트를 위해 개인 로컬에서 돌리고 있는 상황이라 양해 부탁드립니다.