OAuth 의 간단한 이해
이번 포스팅에서 구현할 기능은 OAuth다.
요즘은 흔한 기능이 되었는데, kakao, facebook, google, naver에서 제공하는 로그인 Auth API를 정보를 이용해서 회원가입 또는 로그인을 할 수 있게 한다.
(참고) OAuth의 개념 설명 OAuth와 춤을
어려운 용어들은 우선 제쳐두고, 간단하게 설명하면 이렇다.
1. 홍길동은 구글에 가입한 상태다. 구글에 아이디와 비번, 집주소 기타의 정보가 있다.
2. redmango라는 서비스는 회원가입 시 구글 로그인 API를 사용한다.
3. 홍길동이 redmango 사이트에 접속, 회원 가입을 누른다. 그러면 자체 회원가입 메뉴가 아닌 구글 로그인 화면이 나온다.
4. 홍길동은 구글 로그인을 하게 되면, 구글에서 홍길동의 정보를 redmango 사이트에 제한적인 정보를 준다.
구글에서 redmango 사이트에 주는 정보는 제한적이다. email 주소와 홍길동이 입력한 profile 정도.
5. redmango는 email만 구글로부터 받고 유저를 사이트 회원으로 가입시킨다.
6. 혹시나 홍길동이 redmango에서 물건을 사게 된다면 배송정보는 따로 입력하면 된다.
7. 며칠 후 홍길동이 redmango 사이트에 접속한다면, 이미 접속 정보가 레드망고에 있기에 회원으로 로그인된다.
구글클라우드 콘솔에서 API 및 OAth2.0 클라이언트 ID 발급받기
스프링 부트로 코딩을 하기 전 아래 링크한 구글사이트에서 레드망고사이트에 대한 정보를 등록하고, 클라이언트 ID와 보안키를 생성해야 한다.
추후, 스프링 부트 프로젝트로 기능 구현 시 발급받은 클라이언트 ID와 보안 키로 통신을 할 수 있다.
https://console.cloud.google.com/
Google 클라우드 플랫폼
로그인 Google 클라우드 플랫폼으로 이동
accounts.google.com
여기서부터 약간 헷갈릴 수 있다.
앱 이름과 사용자 지원 이메일, 그리고 하단의 개발자 연락처 정보 정도만 입력하고 "저장 후 계속" 버튼을 누른다.
상단의 순서를 보면 1, OAuth 동의 화면 - 2 범위 - 3 테스트 사용자 - 4 요약.
범위 화면에서 "범위 추가 또는 삭제" 클릭 후, 로그인한 유저의 정보 email, profile 정도만 선택한다.
추후에 유저가 자기 아이디를 넣고 버튼을 누르게 되면 레드망고 서버에 유저의 email과 profile이 리턴된다.
3 테스트 사용자- 저장 후 계속 클릭
4 요약 - 대시보드로 돌아가기 클릭
다시 왼쪽 메뉴 3번째, 사용자 인증정보를 클릭, OAuth 클라이언트 ID를 클릭한다.
처음과는 다르게 애플리케이션 유형 선택 항목이 나온다. 이 중에서 웹 애플리케이션을 선택한다.
만약 안드로이드로 로그인을 구현하고 싶다면 Android 겠지만...
이름에 테스트할 프로젝트 "레드망고서비스로그인"
구글 로그인 후 받을 리다이렉션 레드망고 서버 아이피 주소를 넣는다.
테스트니까 당연히 localhost(127.0.0.1) 포트는 8080 (스프링 부트 기본 포트 8080)
부연 설명을 하자면, 유저가 레드망고 회원가입을 클릭하게 되면 레드망고 내부 컨트롤러에서 구글
https://accounts.google.com/...으로 시작하는 로그인 페이지로 요청을 보내는데 그 주소 뒤에 아래에 적어 넣을 리다이렉션 페이지 주소를 보낸다. 유저가 로그인 후, 그 결과를 레드망고 페이지에 주는데 그것을 처리할 레드망고 컨트롤러 주소라고 보면 된다.
http://localhost:8080/login/oauth_google_check 입력 후, 만들기 클릭
만들기를 클릭하고 나면 클라이언트 ID와 보안 비밀번호를 팝업으로 알려준다. 기억해야 한다.
사실 뒤에 생긴 OAuth 2.0 "레드망고 서비스 로그인"을 클릭해도 아래처럼 클라이언트 ID와 보안키를 확인할 수 있다.
마무리
설정이 모두 잘되었는지 간단하게 테스트를 해보자.
아래처럼 발급받은 클라이언트 ID를 넣고 구글 로그인 주소를 만들어서 호출해본다. 한 줄로...
발급 ID와 리다이렉션 주소가 동일해야 된다.
https://accounts.google.com/o/oauth2/v2/auth?
client_id=발급받은 클라이언트 아이디
&redirect_uri=http://localhost:8080/login/oauth_google_check
&response_type=code
&scope=email%20profile%20openid
&access_type=offline
아래처럼 구글 로그인 페이지가 뜨고, 로그인을 하게 되면 "레드망고 웹애플리케이션" 리다이렉션 페이지로 요청을 하게 된다. 우리는 2편에서 http://localhost:8080/login/oauth_google_check 주소로 결과를 받고 결과에 따라 여러 작업을 하게 된다.
예) Database에 유저 정보를 저장할 수도 있고, 회원가입페이지로 이동시켜 더 많은 정보를 받을 수도 있다.
2편에서는 스프링 부트 프로젝트를 만들고 실제로 구글 로그인 API 기능을 구현해본다.
2022.12.18 - [슬기로운 자바 개발자 생활/스프링 및 자바웹 서비스] - 구글 로그인 API 스프링부트 OAuth 2.0 - 2. 구현해보기
구글 로그인 API 스프링부트 OAuth 2.0 - 2. 구현해보기
이전 포스팅에 이어 스프링 부트와 구글 Oauth API 로그인 연동을 구현해본다. 2022.12.17 - [슬기로운 자바 개발자 생활/스프링 및 자바웹 서비스] - 스프링부트 구글로그인 API 구현 OAuth 2.0 - 1. 구글
ecolumbus.tistory.com
'슬기로운 자바 개발자 생활 > 스프링 및 자바웹 서비스' 카테고리의 다른 글
| 구글 로그인 API 스프링부트 OAuth 2.0 - 2. 구현해보기 (3) | 2022.12.18 |
|---|---|
| 스프링부트에서 jsp사용하기 (1) | 2022.12.17 |
| Spring Profile 활용 Application.properties (0) | 2022.12.15 |
| GRPC 자바 세번째 서버와 클라이언트 만들기 (0) | 2022.12.05 |
| GRPC 자바 두번째 코드생성 (0) | 2022.12.05 |
댓글