개발자를 위한 공모전 사이트 (&&) 2일 _ OAuth 카카오, 구글 로그인 구현

스파르타 코딩클럽_ 내일 배움 캠프 Spring 트랙 6기

[프로젝트] 개발자를 위한 공모전 사이트 (&&)

2023.08.16 ~ 2023.09.15

 

<프로젝트 정보>

개발도구 : IntelliJ

프로그래밍 언어 : Java

데이터베이스 : MySQL

프레임워크 : Spring / Spring Boot / Spring Security

와이어프레임 : Figma

ERD 설계 : ERD Cloud

Storage : AWS S3

Front : HTML / CSS / JavaScript / JQuery / Bootstrap

 

<프로젝트 내용>

오전에는 팀원들과 CS 공부 2시간 후 본격적으로 각자 맡은 코드 구현을 시작했다.

 

OAuth 로그인은 제대로 구현해 본 적이 없어서 생각보다 꽤 복잡했다.

기존에는 서비스 DB 저장을 하는 로그인 기능 + @였다면  이번 프로젝트에서는 서비스 페이지 내 자체 로그인 기능을 지웠다.

대신 카카오톡과 구글이메일 2가지 OAuth 로그인을 구현하기로 했다.

 

두 가지 로그인 방식이 크게 다를 건 없는게 결론.

 

Service Class에서는 인가코드로 액세스 토큰을 요청한 뒤 토큰으로 카카오 api를 호출해서 사용자 정보를 받아올 수 있도록 했다.구글 로그인도 같은 로직으로 진행했다.

public String kakaoLogin(String code) throws JsonProcessingException {
    
        String accessToken = getToken(code);

        KakaoUserInfoDto kakaoUserInfo = getKakaoUserInfo(accessToken);

        User kakaoUser = registerKakaoUserIfNeeded(kakaoUserInfo);

        String createToken = jwtUtil.createToken(kakaoUser.getUserName());
        return createToken;
    }

+구글 로그인 Rest API 발급받는 방법도 알게 되었다. 카카오랑 다르게 client_secret 값도 넣어줘야 한다.

 // HTTP Body 생성
        MultiValueMap<String, String> body = new LinkedMultiValueMap<>();
        body.add("grant_type", "authorization_code");
        body.add("client_id", "1098266395848-j9gih592701mq0q8n2bj4nq7mffg2hjd.apps.googleusercontent.com");
        body.add("client_secret", "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"); // 두개 다 해야함
        body.add("redirect_uri","http://localhost:8080/api/users/google/callback"); // 애플리케이션 등록시 설정한 redirect_uri
        body.add("code",code); // 인가 코드

 

내일은 가라(?)로 프론트를 만들어서 구글, 카카오 코드 동작이 되는지 확인해 볼 예정이다.

 

신경써서 잔디키움- 우당탕탕 커밋파티