Google 소셜 로그인

알파로그·2023년 4월 4일

OAuth2.0 google login oAuth oauth2 security 구글 로그인 소셜 로그인

Spring Boot

목록 보기

33/57

✏️ 환경설정

📍 디팬던시

implementation 'org.springframework.boot:spring-boot-starter-oauth2-client'

📍 application yml 환경설정

client id 와 pw 는 클라우드 콘솔 앱 생성시 획득할 수 있다.
scope 는 google 로 부터 얻어올 수 있는 정보를 뜻한다.

spring:
  security:
    oauth2:
      client:
        registration:
          google:
            client-id: [자신의 구글 클라이언트 아이디]
            client-secret: [자신의 구글 클라이언트 비밀번호]
            scope: profile,email

✏️ 구글 클라우드 콘솔 application 생성

🔗 구글 클라우드 콘솔 링크

📍 새로운 프로젝트 생성

상단에 표시한 박스를 누르면 프로젝트를 선택하거나, 개설할 수 있는 창이 팝업된다.
- 새 프로젝트를 눌러 생성할 수 있다.

📍 OAuth 설정

왼쪽 상단 매뉴 → API 및 서비스 → OAuth 동의 화면
해당 페이지에서 앱을 등록할 수 있다.
- user type 외부
- 공개 범위 설정 등등 항목을 입력해준다.

앱 생성이 완료되고 발급받은 id 와 pw 는 application yml 에 입력해주면 된다.

📍 사용자 인증 정보 생성

사용자 인증 정보 상단에 사용자 인증정보 만들기 -> OAuth 클라이언트 ID -> 웹 어플리케이션
redirect url 설정
- 나머지는 적당히 알아서 입력해주면 된다.

http://localhost:8080/login/oauth2/code/google

✏️ 코드 구현하기

📍 Google 로그인 요청하기

html 버튼 생성하기
- 세팅할 때 appliction yml 에 설정해둔 url 로 요청을 보내는 링크를 생성한다.
클라이언트가 해당 링크를 누르면 goolge 에서 나머지 작업을 처리해준다.

<a href="/oauth2/authorization/google">
    구글로 로그인하기
</a>

📍 Entity 계층

Member Entity 에 새로운 필드를 추가해준다.
- 어떤 방식으로 소셜로그인 했는지 기록하기 위한 속성이다.

// 일반회원인지, 카카오로 가입한 회원인지, 구글로 가입한 회원인지
private String providerTypeCode;

📍 Service 계층

member service 에 로그인과 소셜 로그인을 내부적으로 처리하는 공통로직을 새로 추가한다.
- private 주의!!
method 역할
- member name 이 중복되었는지 확인
- Security 로그인일경우 password 인코딩
  - password 의 유무로 로그인의 종류를 파악할 수 있음
- 새로운 객체 생성후 db 에 저장

//-- login 처리 로직 --//
// 내부 처리함수, 일반회원가입, 소셜로그인을 통한 회원가입(최초 로그인 시 한번만 발생)에서 이 함수를 사용함
private RsData<Member> join(String providerTypeCode, String username, String password) {

    // name 중복 체크 //
    if (findByUsername(username).isPresent())
        return RsData.of("F-1", "해당 아이디(%s)는 이미 사용중입니다.".formatted(username));

    // 소셜 로그인을 통한 회원가입에서는 비번이 없다. //
    if (StringUtils.hasText(password)) 
				password = passwordEncoder.encode(password);

    // 수동으로 새로운 member 객체 생성 //
    Member member = Member
            .builder()
            .providerTypeCode(providerTypeCode)
            .username(username)
            .password(password)
            .build();

		// member 객체 db 에 저장 //
    memberRepository.save(member);

    return RsData.of("S-1", "회원가입이 완료되었습니다.", member);
}

방금 만든 로그인 공통로직을 사용하는 business 로직을 생성

Security 로그인
- name 과 pw 를 매개변수로 받아 join 을 호출한다.
Social 로그인
- entity 에서 생성해준 providerTypeCode 값을 매개변수로 받는다.

//-- security join --//
@Transactional
public RsData<Member> join(String username, String password) {

    // "S-1.1" 해당 회원이 일반회원가입으로 인해 생성되었다는걸 나타내기 위해서
    return join("S-1.1", username, password);
}

//-- social join --//
// 소셜 로그인(카카오, 구글, 네이버) 로그인이 될 때 마다 실행되는 함수
@Transactional
public RsData<Member> whenSocialLogin(String providerTypeCode, String username) {

		// username 예시 : KAKAO__1312319038130912, NAVER__1230812300
    Optional<Member> opMember = findByUsername(username); 

    // 아이디가 있는경우
    if (opMember.isPresent()) 
				return RsData.of("S-2", "로그인 되었습니다.", opMember.get());

    // 소셜 로그인를 통한 가입시 비번은 없다.
    return join(providerTypeCode, username, ""); // 최초 로그인 시 딱 한번 실행
}

📍 Security 계층

소셜 로그인 처리기능만 담당하는 Security 계층을 새로 생성한다.
- REST API 로 응답받은 data 를 DB 에 저장하는 역할이다.
- DefaultOAuth2UserService 를 상속받았다.

package com.ll.gramgram.base.security;

import com.ll.gramgram.boundedContext.member.entity.Member;
import com.ll.gramgram.boundedContext.member.service.MemberService;
import lombok.RequiredArgsConstructor;
import lombok.extern.slf4j.Slf4j;
import org.springframework.security.core.GrantedAuthority;
import org.springframework.security.core.userdetails.User;
import org.springframework.security.oauth2.client.userinfo.DefaultOAuth2UserService;
import org.springframework.security.oauth2.client.userinfo.OAuth2UserRequest;
import org.springframework.security.oauth2.core.OAuth2AuthenticationException;
import org.springframework.security.oauth2.core.user.OAuth2User;
import org.springframework.stereotype.Service;
import org.springframework.transaction.annotation.Transactional;

import java.util.Collection;
import java.util.Map;

@Service
@Transactional(readOnly = true)
@RequiredArgsConstructor
@Slf4j
public class CustomOAuth2UserService extends DefaultOAuth2UserService {

    // 소셜 로그인을 할 Member 의 Service 계층 객체를 DI 해야 한다.
    private final MemberService memberService;

    // 소셜 로그인을 처리하기 위해 필요한 라이브러리
		// 자세한 역할은 모르겠다.
		class CustomOAuth2User extends User implements OAuth2User {
		
		    public CustomOAuth2User(String username, String password, Collection<? extends GrantedAuthority> authorities) {
		        super(username, password, authorities);
		    }
		
		    @Override
		    public Map<String, Object> getAttributes() {
		        return null;
		    }
		
		    @Override
		    public String getName() {
		        return getUsername();
		    }
}

소셜로그인이 성공했을 때 실행되는 method
- CustomOAuth2UserService 의 method 로 생성해주면 된다.

@Override
@Transactional
public OAuth2User loadUser(OAuth2UserRequest userRequest) throws OAuth2AuthenticationException {
    OAuth2User oAuth2User = super.loadUser(userRequest);

		// id
    String oauthId = oAuth2User.getName();

		// providerTypeCode
    String providerTypeCode = userRequest.getClientRegistration().getRegistrationId().toUpperCase();

		// name
    String username = providerTypeCode + "__%s".formatted(oauthId);

		// service 로직을 통한 객체 생성
    Member member = memberService.whenSocialLogin(providerTypeCode, username).getData();

    return new CustomOAuth2User(member.getUsername(), member.getPassword(), member.getGrantedAuthorities());
}