스프링 카카오 로그인 (2. 로그인 요청코드받기,인증 성공 토큰받기)

이번에는 카카오 로그인요청을 통해서 토큰을 받아오는 과정을 수행하겠다.

스프링 부트가 아닌 스프링이다 버젼은 1.8이며 추후에 상세히 적겠다

1. 카카오 사이트 안에있는 가이드라인에 따라 버튼 이미지를 다운받습니다

그림처럼 간단하게 ui를 구성합니다

2. jsp 파일 구성입니다 a태그안에 img태그로 카카오로그인버튼을 가져왔습니다

3. a태그는 아래 사이트에서 가져옵니다

Get 방식으로 그리고 도메인은 host 에 써져있습니다 호스트를붙여서

카카오로그인 요청 url을 완성시킵니다

https://kauth.kakao.com/oauth/authorize?client_id={REST_API_KEY}&redirect_uri={REDIRECT_URI}&response_type=code HTTP/1.1

REST_API_KEY : client_id={REST_API_KEY} 부분으로

전 게시글에 올린 사진을 참고해서 그대로 넣어줍니다

REDIRECT_URI : 말그대로 전시간에 설정해놓았던 REDIRECT_URI를 설정해준다

완성된 Request URI의 값을 a태그에 그대로 넣어주고 실행시키면

아래와같은 그림이 나온다

모두 동의하고 계속하기를 누른다면 서버 쪽에 인증 코드를 보내준다!

위사진의 uri를 확인해보면 redirect uri,callback 주소로 설정해놓은 uri

에 코드값을 담아서 보내준다

인증 자체는 받았지만 또 요청 토큰을 받아야한다 아래 사진을 참고

위의 사진은 무슨뜻이냐면 post방식으로 위의 주소에

즉 https://kauth.kakao.com/oauth/token 이 URI에 http body에 담을

데이터가 총 다섯가지라는 말이다 저기다 다 담아보내라(표를 참고)

x-www-form-urlencoded -> key=value 형식으로 담아보내라(자바map처럼)

4번째 줄의 code는 동적인 값이여서 그때 받아봐야알수있다

5번째 값은 필수는 아니여서 제외할수 있다

필수적으로 4개의 값을 담아 전송해야한다

4번째 유동적인 코드는 콜백 URI에 담겨져온 코드를 말한다

그래서 계정마다 다르기때문에 유동적인 것이다

보낼 http 통신 header값에 형식을 정한다 35번째줄 확인

일단 http 통신 key value로 전송해야하기 때문에

아래 사진처럼 Key-Value 형식으로 그리고 37주석처럼 httpbody 오브젝트 생성을 한다

27 , 28 줄의 라이브러리도 이와 같은 기능을하지만

RestTemplate 라이브러리를 사용하겠습니다

만들어낸 http header값, body 값을 httpEntity를 이용해

한번에 담아내며 그 값을 다시

RestTemplate 라이브러리를 이용해서 전송한다 그러면

아래 그림과 같이 200 엑세스 성공을 알리며 성공 토큰값을 받을수 있게된다

바로위의 코드는 body에 담았던 유동 코드이다

카카오측에서 Response한 토큰값들은 여기서 확인가능하다

결과 : 액세스 토큰 값을 받아내서 카카오측의 접속한 유저의 정보를 가져올수가 있게 된 것이다

출처 : 유튜브 데어프로그래밍