SPRING WEBFLUX OAUTH 2.0 구글 로그인 후 넘어 오는 값(CODE) 방황기

이전 포스팅에서 프런트 페이지에 구글 로그인을 띄우는 것을 다루었다.

이제 로그인이 성공한 후에 제공업체에서 가져온 값을 처리하는 로직을 만들 것이다.

흐름은 알겠는데 로그인 완료 후 jwt를 처리하는 것에 대한 문서가 어디 있는지 잘 보이질 않는다.

그래서 일단 파이어베이스 안이 문서를 살펴보고 있다.

 

기존 프런트 페이지는 이렇게 설정하였다.

https://devkimchi.tistory.com/72

firebase login Sign-in method, web ui 설정, google 로그인 제공 업체 추가

 

문서들을 찾아다니다가 아래와 같은 문서를 발견했다.

https://www.rfc-editor.org/rfc/rfc6749#section-4.1

 

RFC 6749: The OAuth 2.0 Authorization Framework

설명이 나와 있고 저런 스펙으로 동작한다는 거 같은데 

successful response

로그인 성공 후 응답을 저런 스펙에 맞춰서 주지 않을까 생각된다.

 

Spring Webflux Request 정보 확인 하는 방법

@RequestMapping("/signin/success")
@ResponseBody
public Mono<String> signinSuccess(
        ServerHttpRequest request

){

    log.debug("success ::: {}",request.toString());
    return Mono.just("success");
}

ServerHttpRequest를 사용하면 된다.

Spring Boot에서는 httpservletrequest인가를 사용하여 요청에 대한 정보를 확인하는데 webFlux는 모든 클래스들이 이름이 살짝씩 달라서 일일이 다 확인해 가며 사용해야 한다. 단어하나가 더 붙는 그런 수준 새로 다 확인하며 해야 하는 불편함이 있다. 많이 쓰면 상관없겠지만 부트도 쓰고 리액트도 쓰고 하면 헷갈릴 거 같다 IDE가 도와주긴 하지만 긴가민가 하는 게 확신을 주지 못하면 불안한 면이 있지 다시 확인하느라 시간도 걸리고.

아무튼 저 요청 안에 토큰이 들어 있길 기대하지만

디버그 화면

디버그로 체크해서 보아도 딱히 토큰에 대한 정보는 보이질 않는다 내가 못 찾는 건지 방법이 잘못된 건지. 일단 더 찾아본다. 일단 사용자가 로그인 후 받은 코드를 다시 구글로 던져서 토큰을 한 번 더 받아 오는 과정이 있는 거 같은데 그거에 대해서 적어 보겠다. 그전에 걸리던 것이 있는데 Thymeleaf 캐시 설정이다.

THymeleaf Cache 설정 상태 확인 하는 법

기본적으로는 thymeleaf의 cache는 enabled 되어 있다.

하지만 개발 모드에선 캐시가 작동되면 수정 사항이 바로 적용이 안될 수 있어 아래와 같이 yml파일에 disable 할 수 있다.

spring:
  thymeleaf:
    cache: false

하지만 devtools 라이브러리를 설치하게 되면 실행 환경에 맞춰 개발 모드 이면 기본 설정을 캐시 비활성화로 가져간다.

실행환경의 판단 기준이 메이븐이라 그래들 같은 빌드 툴이 run 모드 등 주로 개발에 쓰이는 모드로 실행되면 개발 환경이라 인식하고 jar를 실행시키거나 하는 등 실 서버에서 구동하는 방식으로 사용하면 devtool 모드가 비활성화된다.

아래 사진은 기본 property이고 저렇게 되어 있다는 건 개발 문서를 통해 알 수 있다. 

devtoolsDefaultProperties

하지만 실제로 캐시가 꺼져 있는지 알고 싶다면 @Value 어노테이션을 활용해 테스트해볼 수 있다.

import org.springframework.beans.factory.annotation.Value;

import lombok.extern.slf4j.Slf4j;

 

log.debug("springThymeleafCache {}:::", springThymeleafCache);

 

log : pringThymeleafCache false:::

 

로그를 찍어 보면 캐시가 비활성화되어 있는 것을 알 수 있다.

 

 

자 다시 구글 로그인으로 넘어와서 로그인 후 request에 보면 id라는 것도 하나 넘어오긴 하는 거 같은데 이런 걸 다시 구글 api에 던져서 토큰값을 받는 거 같은데 아직은 뜬 구름 잡는 느낌이다. 잘 아는 사람 옆에 앉혀 놓고 하면 쉬울 거 같은데 혼자 찾아서 하려니 힘들다.

id값 확인

https://docs.spring.io/spring-security/site/docs/5.1.1.RELEASE/reference/html/webflux-oauth2.html

이곳에 보면 OAuth2.0 문서도 있고 상단에 있는 문서 OpenID Connect Core 1.0에 대한 문서도 있고 id값과 secret 값을 다시 던져 토큰 값을 받아 오고 싶은데 다시 보니 이건 스프링 문서네 샘플도 있긴 한 거 같은데 webflux용은 아닐 거 같은 느낌이 스프링은 이쪽 문서 참조하면 될 거 같고 webflux는 더 찾아봐야겠다.

 

https://github.com/spring-projects/spring-security/tree/5.1.1.RELEASE/samples/boot/oauth2login-webflux

GitHub - spring-projects/spring-security: Spring Security

oauth2login-webflux

스프링 5 샘플소드도 찾았는데 지금 제가 쓰고 있는 버전이 6점대라 쓸 수 있을지 아니면 참조해야 할지 봐야겠습니다.

리액티브 애플리케이션은 서블릿과 좀 다른 거 같다 메서드도 다 다르고 하니 흠.. 빨리 더 많이 사용되어 글도 많았으면 좋겠다. 

 

문제는 code를 안 주는 거 같은데 이걸 어디서 어떻게 받아야 하나?

프런트 페이지의 자바스크립트 안에 리턴 url을 

var uiConfig = {
        signInSuccessUrl: '/signin/success',

로 해놔서  당연하게 이쪽으로 리다이렉트가 될 줄 알았지만 계정 선택 화면에 보면 전에 플러터로 만들던 안드로이드, 아이폰, 웹의 웹으로 이동하게 주소가 나오고 있었다.

전에 앱을 만들 때 웹용 프로젝트가 자동으로 생성되면 GCP 계정 설정 쪽에 그쪽 주소가 등록이 되어 있는 거 같아 구글 api 계정 쪽을 살펴보았다.

 

Google Cloud의 api 및 서비스에 사용자 인증 정보의 oauth 중 승인된 리디렉션 URI를 변경해 주니 다른 에러가 발생했다.

먼가 영향이 있다는 건 테스트해 볼 가치가 있다는 것이므로 계속 진행한다.

일단 여기까지 왔으면 다 끝났어야 할거 같은데 새로운 허들이 생겼다.

 

Google Login Oauth2 처리해야 할 것들

1. 리디렉션 URL 설정

프런트에서 유저가 구글 로그인창을 띄우고 그 UI와 통신을 해서 그 페이지에서 자바스크립트로 데이터를 던져 줄 걸 기대했으나 api를 던지고 지정한 URL로 리디렉션 하는 거 같은데 내가 테스트하고 있는 장소가 서버면 도메인도 있고 해서 해당 도메인으로 데이터를 던지겠지만 집에서 테스트 하고 있는 저로서는 중간에 공유기도 있고 허니 개발 서버로 코드를 던지지 못하는 거 같다. 공유기의 DDNS 등을 설정하여 내 컴퓨터로 요청을 날리게 하면 될 거 같다. 하지만 지금 저의 상황이 이 프로젝트를 프로덕트로 만들었는데 프로덕트로 설정해 놓으면 리디렉션 주소가 HTTPS가 돼야 하고 xxx.iptime.org 이렇게 되어 있는 ddns를 ssl설정하고 하는 것도 애매하고 하니 여기서 처리해야 할 문제는

• GCP 설정에서 프로덕트를 테스트 모드로 변경한다. 찾아서 변경해 줘 본다.
• ddns 설정등을 통해 내 개발 컴으로 요청이 들어오도록 한다 그래서 code를 던져 주는지 확인한다.
  위에선 파이어 베이스 만들 때 만들었던 플러터웹 주소가 등록되어 있어 그쪽으로 던져줬던 거 같다 그래서 중간에 한번 로그인 페이지를 다시 읽는 거 같던데 그리고 반응이 없으면 uiconfig에 넣었던 링크로 코드 없이 단순 리디렉션 시키는 거 같고 이것도 테스트해 보아야 한다.

2. 공유기 DDNS 설정 

• 공유기 설정에서 DDNS 설정으로 외부에서 접속가능한 상태로 만든다
• 포트 포워드 기능을 사용하여 개발컴으로 해당 포트의 요청이 들어오도록 한다
• xxx.iptime.org:60000/signin/success 이렇게 요청이 들어오도록 만든다

3.SPRING WEBFLUX SSL 설정

요즘은 사이트 만들면 SSL은 필수 무료 SSL 만들고 설정하기

 

금방 끝날 줄 알았지만 자꾸 딜레이가 돼서 너무 늦은 관계로 다음에 해 보려 한다.