OAuth - 구글 로그인(구글 api를 통해 회원 프로필 받아오기)

소셜 로그인은 간편하기에 프로젝트에서 많이 사용된다고 알고있다.

 

지금까지 소셜 로그인을 구현해본 적이 없어서 소셜 로그인을 구현해볼 것이다.

 

우선 구글 클라우드에서 API를 등록한다.

구현 끝나고 바로 삭제할 예정

 

 

application.yml

spring:
  security:
    oauth2:
      client:
        registration:
          google:
            client-id: 1031257684665-knkr9fbcoeud3gg55hc3kr47cd2n2g2q.apps.googleusercontent.com
            client-secret: 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
            redirect-uri: http://localhost/8080/login/oauth2/code/google
            scope:
              - email
              - profile

application.yml 파일에 위와 같이 시큐리티 관련된 내용들을 입력해주면 된다.

 

구글 클라우드 페이지에 등록된 client-id, client-secret, redirect-uri을 입력해준다.

 

 

 

 

SecurityConfig.class

@Configuration
@EnableWebSecurity // 스프링 시큐리티 필터가 스프링 필터체인에 등록이 된다.
@EnableGlobalMethodSecurity(securedEnabled = true)
public class SecurityConfig {

    @Autowired
    private PrincipalOauth2UserService principalOauth2UserService;

...

        http.oauth2Login(oauth2 -> oauth2
                .loginPage("/loginForm")
                .userInfoEndpoint(userInfoEndpoint -> userInfoEndpoint
                    .userService(principalOauth2UserService))
        );

        return http.build();
    }
}

PrincipalOauth2UserService를 SecurityConfig에 있는 oauth2Login 설정에 넣어주었다.

PrincipalOauth2UserService에 대해서는 바로 아래에 코드와 함께 설명이 있다.

 

구글 로그인이 완료된 뒤의 후처리가 필요하다. 코드를 받는 것이 아니라 액세스 토큰 + 사용자 프로필 정보를 받아오는 역할을 PrincipalOauth2UserService가 한다.

 

 

 

 

 

PrincipalOauth2UserService.class

@Service
public class PrincipalOauth2UserService extends DefaultOAuth2UserService {

    // 구글에서 받은 userRequest 데이터를 후처리하는 함수
    @Override
    public OAuth2User loadUser(OAuth2UserRequest userRequest) throws OAuth2AuthenticationException {
        System.out.println("getClientRegistration : " + userRequest.getClientRegistration());
        System.out.println("getAccessToken : " + userRequest.getAccessToken());
        System.out.println("getAttributes() : " + super.loadUser(userRequest).getAttributes());
        return super.loadUser(userRequest);
    }
}

구글 로그인을 받아와서 후처리를 해주는게 필요하기 때문에 PrincipalOauth2UserService를 만들었다.

 

 

어떻게 진행되는지 설명을 해보자면, 구글 로그인 버튼을 클릭하면 구글 로그인 창으로 이동한 다음에 로그인이 완료된다.

 

로그인이 완료되면 code를 리턴하는데, OAuth-client 라이브러리가 코드를 통해서 AccessToken을 요청하여 userRequest 정보를 받는다.

 

이 userRequest 정보로 회원 프로필을 받아야 하는데, 이때 사용되는 함수가 loadUser 함수이다.

 

즉, loadUser 함수를 호출해서 구글로부터 회원프로필을 받아오는 것이다.

 

 

로그인 페이지에서 구글 로그인을 진행하고, 호출되는 함수를 통해 사용자 정보, 토큰 등을 출력해보니 아래와 같이 나왔다.

 

가장 중요한 것은 return 값으로 설정되어있는 super.loadUser(userRequest)이다.

 

마지막 줄에 출력된 정보의 sub라는 값은 구글 아이디의 PK 같은 것이라 한다.

또한 이름, email, 프로필 사진 등이 포함되어 있다.

 

 

여기 있는 정보들로 회원가입을 진행할 예정이다.

 

username = google_(구글에서 받아오는 sub 값)

password = "암호화" // 구글 로그인으로 진행될 것이고 비밀번호를 쳐서 로그인 할 것이 아니라 아무거나 들어가도 됨

email = 구글에서 받아오는 이메일

role = ROLE_USER

provider = "google"

provider_id : 구글에서 받아오는 sub 값

 

 

User 엔티티

@Entity
@Data
public class User {

    @Id
    @GeneratedValue(strategy = GenerationType.IDENTITY)
    private long id;
    private String username;
    private String password;
    private String role;

    private String provider; // ex) google
    private String providerId;

    // ENUM으로 안하고 ,로 해서 구분해서 ROLE을 입력 -> 그걸 파싱!!
    public List<String> getRoleList() {
        if (this.role.length() > 0) {
            return Arrays.asList(this.role.split(","));
        }
        return new ArrayList<>();
    }
}

OAuth로 로그인을 하는 회원인지 확인하기 위해서 provider, providerId를 User 테이블에 추가했다.

 

 

다다음 포스팅에서 받아온 정보를 가지고 구글 로그인 및 자동 회원가입을 진행해 볼 예정이다.

(다음 포스팅에서는 로컬 로그인과 구글 로그인의 정보를 한꺼번에 받을 수 있도록 Authentication 객체에 대한 내용)