이 글을 읽기 전 아래를 필독하고, 구현까지 해놓았다면 이번 카카오 로그인은 누워서 떡먹기이다. 근데 누워서 떡먹기란 말은 사실 모순인데 누워서 떡 먹는 게 생각보다 힘들다. 아 잡소리 그만하고 진행해보도록 하자.
Spring_구글 로그인 REST API 구현 OAuth2
새로 리팩터링 해서 구현한 CRUD를 블로그에 작성해야 하고,,🥹 다른 스택 사용한 것도 작성해야 하는데 언제 다 쓸지 벌써 막막하다.. 일단 최근에 OAuth2를 공부하면서 의존성을 추가해 구현하는
dev-chw.tistory.com
REST API를 이용해 소셜 로그인을 진행할 때는 워낙 중복되는 부분이 많기 때문에 위 링크를 타서 꼭 읽어보고 구현을 해보면 좋을 것이다. 그러면 이번 장을 이해하는데 정말 쉽고 구현도 정말 간단하게 할 수 있을 거니까,, 그렇기 때문에 설명도 매우 매우 매우 간략하게 하겠다.
이번에도 마찬가지로 kakao에서 키를 발급받아야 하기 때문에 아래 블로그를 참고해 발급받도록 하자!
[자바스크립트] 카카오 로그인 API 쉽게 구현 방법 및 예제- OAuth 2.0, Javascript, Jsp
카카오 로그인 API (OAuth 2.0) 클라이언트 입장에서 수많은 사이트의 모든 아이디 비밀번호를 기억하기는 쉽지 않습니다. 또한 서비스를 제공해주는 리소스 오너 또한 안전하게 보관하여야 하
tyrannocoding.tistory.com
위 코드는 자바스크립트이어서 우리는 REST API를 이용한 로그인 구현이기에 발급 과정까지만 이어가주고 완료되었다면 해당 페이지를 읽도록 하자! 발급받고 페이지에서 redirectURL을 등록하는 부분이 있는데 빼먹지 않고 자신이 사용할 redirectURL을 등록하도록 하자!
저번 구글 로그인과 마찬가지로 카카오 로그인 창으로 redirect 해줄 것인데 방법은 동일하다 kakaoOAuth라는 클래스를 따로 생성해 responseUrl 메서드로 return을 준후 위 Get 반응을 일으켜 redirect 해줄 것이다. 메서드는 아래와 같다.
구글 로그인 때와 마찬가지로 application.properties에 발급받은 key와 url을 등록하여 로그인 창으로 넘어가게 만들어 준다. 코드에 문제가 발생되지 않았다면 서버를 실행하여 성공적으로 카카오 로그인 창으로 이동하는지 보도록 하자.
문제가 없었다면 위와 같은 로그인 창이 뜰 것이고 아이디로 로그인을 한다면 url에는 code값이 넘어올 것이고, 당연하게도 상태 오류가 날 것이다. 왜냐면 redirect 됐을 때 Service를 구현하지 않아서... 사실상 구글 로그인과 똑같다. 방식이 REST API이기 때문에 같을 수밖에 없기도 하고,,, 아무튼 이제 redirect 됐을 때 Service를 만들어보자.
login/kakao로 redirect 되었을 때 return 된 code값을 가지고 이번에도 Service에서 kakaoLogin을 구현해보도록 하자.
이것도 구글 로그인과 마찬가지로 일련의 처리과정을 거치는 메서드를 구현해주었다. 마지막 return은 과정을 전부 거친 후 나오는 카카오의 유저 정보를 return 해준다. 그렇다면 이번에도 한 줄씩 kakaoOAuth 클래스의 메서드들이 어떤 로직을 가지는지 살펴보자!
구글 로그인 편을 본다면 쉽게 이해될 것이다. httpEntity로 code값을 이용해 AccessToken을 가져오는 과정이다. 근데 이번에도 구글 로그인과 마찬가지로 받아온 body들을 자바 객체로 변환해줘야 하지 않을까? 정답은 YES.. 그래서 getAccessToken 메서드가 사용된다.
이것도 구글 로그인 때와 똑같이 Dto를 하나 생성해 담아주면 자바 객체로 변환이 되며 Dto를 return 해주면 된다.
각각의 attribute가 구글과 차이점을 보인다. 하나라도 빼먹으면 바로 Exception이 발생되니 조심하도록 하자!
자바 객체로 변환해 Dto를 return 해주었기 때문에 이제 Dto에서 getter를 통해 access_token을 가져와서 또 유저 정보를 가져와야 하지 않을까? 정답이다. 그래서 requestUserInfo 메서드가 사용된다.
메서드들의 이름도 구글 로그인과 똑같이 지었는데 그만큼 동일하다는 건 강조하고 싶었다. 어느 하나 틀린 부분 없이 token값을 getter를 통해 가져와서 헤더에 등록하여 httpEntity를 생성해 response를 return 해주면 body에 유저 정보를 제공해준다. 근데 유저 정보는 자바 객체 형식이 아니다. 그래서 자바 객체로 변환하기 위해 Dto를 통해 담아내는데 그래서 getUserInfo 메서드가 사용된다.
return 해준 값에서 body를 가져와서 우리가 유저 정보를 받기 위한 Dto를 생성해 안에다 담아준 이후에 return 해준다. 그렇다면 이제 우리는 카카오 로그인 및 유저 정보를 가져오는 데 성공하였다! 아래는 Dto 코드이다.
카카오는 기본적으로 body에 많은 정보를 담아주는데 하나라도 빼먹으면 바로 Exception이 나버리니 빼먹지 않도록 하자. 또한 key를 발급받을 때 추가 정보를 요청했다면 꼭! 카카오 개발자 가이드에서 response값들을 참고하여 Dto를 구성해주도록 하자. 말했듯이 하나라도 없으면 Exception이 터진다. 물론 친절하게 뭐가 없는지 알려준다 ^-^
아무튼 이 과정을 거쳤다면 성공적으로 카카오 로그인 및 유저 정보까지 가져올 수 있고 이후에는 개발자가 알아서 유저 정보를 이용하면 될 것이다. 저번 구글 로그인과 마찬가지로 필자는 유저 정보가 이미 로컬 DB에 있다면 JWT 발급과 로그인, 없다면 유저 정보를 DB에 등록 후 JWT 발급과 로그인이 되는 형식으로 코딩을 했다.
작성하고 보니 REST API를 이용해 소셜 로그인을 구현하는 것은 코드가 95% 이상이 일치하는 것 같다. 즉 소셜 로그인을 하나라도 REST API 형식으로 구현할 수 있다면 여러 소셜 로그인을 쉽게 구현할 수 있을 것이다. 아무튼 이번 카카오 로그인은 구글 로그인 편을 꼭 읽고, 이번 편을 진행하는 것이 훨씬 수월하고 이해하기 쉬울 것이다. 개념적인 부분은 구글 로그인 편에 많이 정리해두었기 때문에 카카오 로그인 편은 많이 생략하였다.
아무튼, 이렇게 해서 카카오 로그인 편을 마치도록 하겠다. 다음 편은 뭘 써야 할지 잘 모르겠다. 요즘 너무 바빠가지고 블로그를 건드리지도 못했는데 이렇게 밀린 블로그 일지들을 작성할 수 있어서 다행이다,, 근데 아직 많이 밀려있는데..
Spring의 개념이나 이론적인 부분도 적어놔야 할 것 같은데 언제 다 적을지도 모르겠다! 아무튼 또 빠른 시일 내에 새로운 글로 돌아오도록 하겠다. 그럼 안녕! 😪
'모험가의 Spring > Spring' 카테고리의 다른 글
| Docker + SpringBoot 개발환경 구축 (1) | 2022.10.07 |
|---|---|
| JPA findAll() 정렬해서 가져오는법 (0) | 2022.10.01 |
| Spring _구글 로그인 REST API 구현 OAuth2 (0) | 2022.09.30 |
| JpaRepository에서 Optional 객체에 담긴 정보 가져오기 (0) | 2022.09.30 |
| 인텔리제이로 Spring을 개발할때 TIP ! (0) | 2022.09.05 |