[GDG] 홍대 맛집 아카이빙 프로젝트 백엔드 개발 #1 - OAuth에 대해서...

대학교 졸업할 때는 풀스택 개발자가 되기를 기원하며 백엔드 개발부터 시도했다. (사실 몇 년 전에 프론트엔드 맛보기 작업을 몇 개 했는데 내 스타일이 아니어서...)

백엔드 개발공부의 일환으로 GDG 프로젝트 트랙에 지원했고, 운좋게 선발되어서 홍대 맛집 아카이빙 프로젝트의 백엔드 개발자로 참여하게 되었다.

 
코어타임(팀 회의)이 7월 9일에 있었고, 다음 코어타임이 7월 21일이다. 지도 API 개발에 시간이 좀 걸릴 것 같아 최대한 빨리 기능들을 만드는 중이라 7월 16일에는 적어도 모든 로그인 기능을 끝내놓는게 좋을 듯하다.

그 전까지 내가 DB를 제외한 로그인 기능과 커뮤니티 기능을 맡기로 했다. 로그인 기능의 목표는 완성, 커뮤니티 기능은 최대한 만들어보기로...

 
쓰다보니 약간 회고록 느낌이 나긴 하는데..
이게 배우는 거에 초점을 맞추는게 아니라 구현에 초점을 맞춘거라 다시 본격적으로 관련 기능들을 익히면 따로 포스팅을 쓸 계획이다.

 

---

이번주말 (7월 12일~7월 13일)에는 구글 로그인 관련 기능을 개발했다. 원래는 주말 내내 하고싶었는데 알바 대타를 뛰는 바람에 많이는 못하고 구글 로그인만 담백하게 구현했다.

구글 로그인에는 구글 OAuth를 사용했다.

⚠️본 게시글은 포스팅이나 GPT를 뒤적거리며 찾아낸 정보로 실제와 다를 수 있으며, 오히려 틀릴 수도 있습니다. 오류지적은 환영입니다.

---

OAuth란...
인터넷 사용자들이 비밀번호를 제공하지 않고 다른 웹사이트 상의 자신들의 정보에 대해 웹사이트나 애플리케이션의 접근 권한을 부여할 수 있는 공통적인 수단으로서 사용되는, 접근 위임을 위한 개방형 표준이다. (위키백과)
그니까 내 서비스가 내 이용자의 정보를 얻기 위해서 타사 서비스의 정보를 가져오도록 허가받는 과정이라고 보면 될듯. 권한 위임 프로토콜. 여기서는 유저의 이메일주소 정도가 정보로 칠 수 있겠다..


OAuth 개념이 꽤 중요하기 때문에 유튜브 영상을 몇 개 찾아봤다.
OAuth에는 3명의 참여자가 등장하는데,

- 나
- 사용자
- 나의 서비스를 연동하려는 그룹 (여기서는 구글)

'사용자'가 '나'의 서비스를 이용하는데, '나'의 서비스가 '사용자'를 대신하여 '그룹'의 서비스에 접근하여 기록을 남기는 것-> 내가 개발하려는 환경에서는 내 프로그램이 사용자를 대신하여 구글에 로그인하여 그들의 이메일 주소 등을 저장하는 과정이라고 볼 수 있겠다.

---

대충 메커니즘은 이렇다고 한다.
용어도 유저, 클라이언트, 서버 등도 있는데 우선은 이해가 목적이기에 '나', '사용자', '그룹'으로 정의한다.

1. '나'의 서비스가 '그룹'의 서비스에 접근함. 이 때 '그룹'의 서비스는 바로 ID를 주지 않고 accessToken을 발급. 이는 '나'의 서비스가 '그룹'의 서비스에서 필요한 것만 사용할 수 있도록하는 일종의 비밀번호

2. '나'가 '그룹'의 정보를 이용하기 위해서는 사전승인이 필요하는데, 이는 서비스마다 다르다.

사전승인에 필요한 요소들은 공통적으로 Client ID ('나'의 서비스의 식별자) / Client Secret (식별자 비밀번호) / Authorized redirect URLs (권한을 부여받을 URL 주소)가 있다. 이 정보는 모두 '나'와 '그룹'이 알고있다.

 

내 구글 OAuth의 클라이언트 ID / 비밀번호 / URLURL은 아직 개발 중이라 localhost로 받는다.

3. '사용자'가 '나'에게 접근할 때 '그룹'의 서버를 사용해야할 경우, '사용자'에게 소셜로그인 화면, 또는 '그룹'의 인증을 필요하다는 것을 확인, 공지함

4. '사용자'가 공지를 확인하고 로그인 버튼 등을 누르면  '그룹'이 정한 OAuth 인증 url로 연결됨

구글로그인 버튼을 눌렀을 때 이동할 링크
-> 로그인이 안되어 있을 경우 로그인 화면이 뜸

5. '그룹'이 '나'의 ID (위에서의 클라이언트 ID)와 같은 ID가 있는지, 리다이렉트 URL도 확인하고 '사용자'에게 정보제공에 대한 허용여부를 물음. 허용할 경우 '그룹'이 '사용자'에 대한 정보를 받음

6. '그룹'은 authorization code라는 일회용 코드를 만들어 '사용자'의 브라우저를 redirect_url로 이동시킴

https://resource.server/token?grant_type=authorization_code&code=3&redirect_rul=https://client/callback&client_id=1&client_secret=2
 
뭐 이런 식의 링크로 이동시킴
이동하면 '사용자'는 '나'가 OAuth를 설정할 때 리다이렉트 url로 미리 설정한 URL에 쿼리 파라미터로 authorization code를 추가하고 GET 요청을 보냄. 이러면 '나'는 미리 설정한 URL로 이동해서 유저의 요청을 받고 authorization code를 확인한다.

7. 그리고 다시 '나'는 '그룹'에 authorization code, client id, client secret, redirect_url을 전달해 일치여부를 확인하고 AccessToken을 발급받는다.

api호출이나 refresh token도 있는데 그건 나중에..

즉 구글 로그인을 기준으로하면..
1. 사용자가 구글로그인 버튼을 누르면 사용자는 구글로그인이 필요하며 어떤 정보를 웹사이트에게 전달할지 명시한다.
2. 사용자가 이를 인지하고 허용하면 사용자는 구글 OAuth에 필요한 URL로 이동
3. 구글은 사용자에게 정보제공에 대한 동의여부를 확인함
4. 사용자가 허용하면 구글은 authorization code를 만들어 사용자를 웹사이트가 정한 URL에 authorization code를 붙여 GET 요청을 보내게 한다.
5. 웹사이트는 요청을 받고 authorization code를 확인한 후 이를 구글에 보낸 후 AccessToken을 발급받는다. AccessToken을 통해 유저의 정보에 도달할 수 있다.

감사하게도 Spring Security 는 거의 모든 기능을 제공하며 우리가 해야할 것은 설정한 OAuth 정보와 이동할 리다이렉트 URL만 있으면 된다.
추가로 스프링의 경우에는 AccessToken을 활용하여 사용자의 정보를 받아 OAuth2User 객체가 생성된다. 오늘은 아니지만 내일 개발하면서 써야할 것들.

---

로그인 기능은 다행히 예전에 진행했던 팀프로젝트에서 OAuth 기능을 만들어놔서 뼈대는 간단하게 잡을 수 있었다. 코드 안 맞는거만 좀 수정하고.. 구글 인증서라고 해야하나.. OAuth에 필요한 인증서 다시 발급받고..

저번에는 인터페이스 기능을 안서서 인터페이스를 만들어보았다.
인터페이스의 장점으로 확실히 이 서비스, 컨트롤러가 어떤 역할을 하는지 알 수 있다.

다른 인터페이스의 장점으로 다중상속, 수정용이 등이 있는데.. 아직 거기까지는 잘 모르겠다.. 나중에 백엔드 지식과 자바 지식이 많이 쌓이면 알지 않을까? 지금은 자바도 겨우 하는 입장이라ㅋㅋ

그래도 추상클래스 개념정도는 익힐 수 있었다. 그것도 사실 오타 때문에 상속받는 메서드끼리 이름이 달라져서 생긴 오류긴 했지만.. -> XX은 추상메서드가 아니며 추상메서드를 상속하지 않습니다 뭐시기 오류

 
대충 고치고 나서 다시 프로그램을 돌리니 spring security UnsatisfiedDependencyException 오류가 생기는데 이건 의존성 하나 추가하며 해결.. 근데 이번 개발의 목표는 '최대한 GPT를 적게 써보자!' 여서 아무리 구글링을 해도 지금은 지원안하는 코드를 보여주며 해결이 안되는데 GPT에게 물어보니 몇 초만에 해결했다....

 

▷개발 시험구현 영상
https://youtu.be/-TQyZPH6kRY

 
그래서 대충 완성했다.
오늘의 목표는 응답상태 반환을 목표로 했다.

이전에 팀프로젝트 할 때나, 프로젝트트랙에서 CRUD 프로젝트를 할 때도 응답코드를 반환하지 않았는데 이번에는 반환기능을 넣어봤다. 200은 로그인 성공 및 메인페이지 이동, 250은 회원정보가 없어 회원가입 화면으로 이동하는 것.
생각해보니 코어타임 때 회원가입 API 명세서를 짜지 않았는데 이번주 내로 팀에 문의를 해봐야겠다.

 
오늘은 여기서 마무리!
내일부터 다시 열심히 개발해보자고... 백준 쉬운거라도 좋으니까 하루에 IntelliJ나 VScode를 한 번이라도 켜보자