게시판 구현(5) 소셜로그인 추가하기 (Google/Kakao)

도롱뇽·2025년 5월 18일
post-thumbnail

이번에는 기존 JWT 로그인 방식에 더해,
소셜 로그인(Google, Kakao) 기능을 추가해보았습니다.


🎯 목표

  • 기존 이메일/비밀번호 로그인(JWT)은 그대로 유지
  • Google/Kakao 로그인 기능 추가
  • 단순히 로그인만이 아니라, 게시글 작성까지 연동

1. Security 설정 (Google & Kakao)

위 두 사이트에서 애플리케이션을 등록하고, Client ID/Secret 발급을 받아
application.properties에 등록해주었습니다.

📄 참고한 글:

필요한 의존성도 추가 완료:


2. Spring Security란?

✅ 한 줄 요약

Spring Security는 보안의 모든 것을 대신 처리해주는 보안 프레임워크입니다.

  • 로그인/로그아웃
  • 권한/인가 처리
  • 비밀번호 암호화
  • 접근 제한

이 모든 걸 개발자가 직접 구현하지 않고도 처리할 수 있게 해주는 강력한 도구입니다.

✅ 내 프로젝트에서의 활용

처음엔 JWT만 사용했기 때문에 로그인 로직도 수동으로 구현했었습니다.
하지만 소셜 로그인을 적용하려다 보니 인증 흐름이 더 복잡해졌고,
이제는 Spring Security의 OAuth2 흐름에 따라 처리하게 되었습니다.

"소셜 로그인 사용자 인증은 Security가 처리,
기존 JWT 방식은 내 커스텀 필터가 처리"
두 방식이 공존하는 구조입니다.


3. 소셜 로그인과 DB 연동

소셜 로그인 성공 시, 구글/카카오에서 사용자 정보를 JSON으로 넘겨줍니다.
하지만 이 정보는 우리 서비스에서 사용하는 MemberEntity 형태와 다르기 때문에
중간 가공 과정이 필요합니다.

그래서 등장한 것이 바로...


✅ CustomOAuth2UserService

OAuth2UserService를 상속받아 만든 커스텀 클래스입니다.
소셜 사용자 정보를 우리가 원하는 형식으로 변환하고
DB에 저장하거나 기존 회원과 연결하는 역할을 합니다.

🔧 하는 일

  • 소셜 제공자(Google, Kakao) 구분
  • 사용자 정보(email, name 등) 추출
  • DB에 해당 이메일이 없으면 → 자동 회원가입
  • 최종적으로 OAuth2User 객체 생성하여 반환
if (optionalMember.isEmpty()) {
    MemberDTO dto = new MemberDTO();
    dto.setMemberEmail(email);
    dto.setMemberName(name);
    dto.setMemberPassword(UUID.randomUUID().toString()); // 임시 비밀번호

    MemberEntity newMember = MemberEntity.toMemberEntity(dto);
    memberRepository.save(newMember);
}

이렇게 하면 구글/카카오로 로그인한 사용자도
자동으로 회원가입 → 로그인 → 글 작성까지 가능해집니다.


4. 테스트

구글 로그인 성공 화면 👇

DB에도 정상적으로 저장됨 👇

글 작성까지 문제없이 완료 👇


5. 소감

과제는 구글 로그인만 구현하는 것이었지만,
현재 진행 중인 프로젝트에서 구글과 카카오 로그인을 함께 적용한 경험이 있어서
이번 과제를 비교적 수월하게 진행할 수 있었습니다.

다만, 기존의 JWT 방식 로그인 흐름에 소셜 로그인 로직을 자연스럽게 녹여 넣는 과정은 쉽지 않았고,
두 방식이 충돌하지 않도록 보안 필터를 따로 분리하고 조율하는 데 많은 고민이 필요했습니다.

그리고 문득, 두 달 전 스터디 초반에
Spring Boot로 CRUD 게시판 하나 만드느라 하루 종일 붙잡고 있었던 기억이 떠올랐습니다.
이제는 소셜 로그인까지 붙이고 DB 연동도 직접 설계하고 있는 걸 보니,
확실히 성장했다는 걸 새삼 느낍니다. 💪

profile
개발자 성장 기록용

3개의 댓글

comment-user-thumbnail
2025년 5월 20일

카카오톡 로그인 기능은 아직 구현해보지 않았는데 해봐야겠어요 네이버 로그인 기능도 구현해보면 좋을 것 같아요!

답글 달기
comment-user-thumbnail
2025년 5월 20일

저는 완전 힘들게 했는데 쉽게 하시는 모습이 너무 부럽습니다..!

답글 달기
comment-user-thumbnail
2025년 5월 27일

카카오톡 로그인까지 구현한게 정말 대단하네요 !! 저도 한 번 카카오톡 로그인도 해보도록 하겠습니다... 수고하셨습니다 !!!

답글 달기