[Spring Security] 스프링 부트 OAuth2를 이용한 구글 계정 로그인 (직접 구현)

이번 시간에는  구글계정으로 로그인 기능을 구현해보겠습니다.

참고 :

• 네이버 계정으로 로그인은 여기를 참조하시기 바랍니다.
• 카카오 계정으로 로그인은 여기를 참조하시기 바랍니다.
• 소셜 로그인을 하기위해 필요한 API 키 발급은 여기를 참조하시기 바랍니다.

---

 

1. 인증 코드 받기

원하는 태그에 링크를 추가해줍니다.

<a href="https://accounts.google.com/o/oauth2/v2/auth?
 scope=https%3A//www.googleapis.com/auth/drive.metadata.readonly&
 access_type=offline&
 include_granted_scopes=true&
 response_type=code&
 state=state_parameter_passthrough_value&
 redirect_uri=https%3A//oauth2.example.com/code&
 client_id=client_id">구글 로그인</a>

 

해당 태그를 클릭하게 되면, 구글 리소스 서버로 요청을 보내게 되고, 우리가 설정한 리다이렉션 URI로 코드를 받을 수 있습니다.

링크를 확인해보면, 아래와 같이 쿼리 스트링 파라미터에 code값이 담겨있을 것입니다.

http://localhost:8080/login/oauth2/code/google?code=4%2F0AY0e-g6cMCFbgwTV.........AFZl50QB77171EBPQApBwA

 

2. 인증 코드를 가지고 Access 토큰으로 교환하기

 

2-1. Redirect URI 요청을 처리할 Controller 생성

@GetMapping("/google")
@ResponseBody
public String googleOAuthRedirect(@RequestParam String code) {

    RestTemplate rt = new RestTemplate();

    HttpHeaders headers = new HttpHeaders();
    headers.add("Content-Type", "application/x-www-form-urlencoded");

    MultiValueMap<String, String> params = new LinkedMultiValueMap<>();
    params.add("client_id", "986673395771-5hs9a0e3keolbsa9rvc0ologqrq21vlm.apps.googleusercontent.com");
    params.add("client_secret", "BaTi_oegV5ts5yMkHUhGv-ZN");
    params.add("code", code);
    params.add("grant_type", "authorization_code");
    params.add("redirect_uri", "http://localhost:8080/login/oauth2/code/google");

    HttpEntity<MultiValueMap<String, String>> accessTokenRequest = new HttpEntity<>(params, headers);

    ResponseEntity<String> accessTokenResponse = rt.exchange(
    	"https://oauth2.googleapis.com/token",
        HttpMethod.POST,
        accessTokenRequest,
        String.class
    );
    
    return "response : " + accessTokenResponse.getBody();
}

각각 알맞은 정보를 넣어준 뒤 서버에 요청하면, 엑세스 토큰을 받을 수 있습니다. 

 

3. 프로필 정보 요청하기

도저히 못 찾다가 아래와 같은 요청을 찾았는데 맞는지 모르겠다..

 

위의 컨트롤러에 아래 프로필 요청 코드만 붙여주면 됩니다.

	... 코드 생략 ....
    
    // 여기서부터, 프로필 정보 얻어오는 요청
    HttpHeaders headers1 = new HttpHeaders();
    headers1.add("Authorization", "Bearer " + googleOauthParams.getAccess_token());

    HttpEntity profileRequest = new HttpEntity(headers1);

    ResponseEntity<String> profileResponse = rt.exchange(
        "https://oauth2.googleapis.com/tokeninfo?id_token=" + googleOauthParams.getId_token(),
        HttpMethod.GET,
        profileRequest,
        String.class
    );
    
    return "프로필 정보 : " + profileResponse.getBody();
}

 

 

이렇게 요청을 하게 되면, 아래 처럼 정상적으로 데이터를 받을 수 있습니다!

{
 // These six fields are included in all Google ID Tokens.
 "iss": "https://accounts.google.com",
 "sub": "110169484474386276334",
 "azp": "1008719970978-hb24n2dstb40o45d4feuo2ukqmcc6381.apps.googleusercontent.com",
 "aud": "1008719970978-hb24n2dstb40o45d4feuo2ukqmcc6381.apps.googleusercontent.com",
 "iat": "1433978353",
 "exp": "1433981953",

 // These seven fields are only included when the user has granted the "profile" and
 // "email" OAuth scopes to the application.
 "email": "testuser@gmail.com",
 "email_verified": "true",
 "name" : "Test User",
 "picture": "https://lh4.googleusercontent.com/-kYgzyAWpZzJ/ABCDEFGHI/AAAJKLMNOP/tIXL9Ir44LE/s99-c/photo.jpg",
 "given_name": "Test",
 "family_name": "User",
 "locale": "en"
}

 

이상으로 구글 아이디로 로그인 기능을 구현해보았습니다.

감사합니다.

---

REFERENCE

웹 서버 애플리케이션에 OAuth 2.0 사용  |  Google ID 플랫폼  |  Google Developers