OpenID Connect (OIDC)에서 Redirect URI와 Authorization Code Flow 이해하기

Redirect URI란 무엇인가?#

Redirect URI는 Reply URL로도 알려져 있으며, OIDC 인증 과정에서 중요한 보안 구성 요소입니다. 사용자가 OIDC 제공자를 통해 성공적으로 로그인한 후 전송되는 URL을 지정합니다. 더 중요하게는, 애플리케이션이 토큰을 얻기 위해 필요한 인증 코드를 수신하는 곳입니다.

자세한 내용은 Redirect URI wiki를 확인하세요.

Authorization Code Flow란 무엇인가?#

Authorization Code Flow는 OAuth 2.0 RFC 6749, section 4.1에 정의된 OIDC의 기본 인증 방법입니다. 인증 코드를 액세스 토큰 및 선택적으로 리프레시 토큰으로 교환하는 것을 포함합니다. 이 흐름은 서버 사이드 웹 애플리케이션과 같이 클라이언트 비밀을 안전하게 유지할 수 있는 애플리케이션에 적합합니다.

자세한 내용은 Authorization Code Flow wiki를 확인하세요.

Authorization Code Flow에서 Redirect URI는 어떻게 작동합니까?#

Authorization Code Flow에서는 Redirect URI가 OIDC 제공자가 사용자를 성공적으로 인증한 후 인증 코드를 전송하는 대상지입니다. 보안을 보장하고 허가되지 않은 리디렉션을 방지하기 위해 OIDC 제공자와 사전에 등록되어야 합니다.

Logto Console에 Redirect URI를 등록하는 방법을 안내드립니다:

로그인을 시작할 때:

1. 인증 요청: 애플리케이션은 client_id, response_type, scope 및 redirect_uri와 같은 매개변수를 포함하여 사용자를 OIDC 제공자의 인증 엔드포인트로 안내합니다.
2. 사용자 인증: 사용자가 OIDC 제공자와 인증합니다.
3. 인증 코드 전송: 인증이 성공하면, OIDC 제공자는 사용자를 지정된 redirect_uri로 리디렉션하며 인증 코드를 쿼리 매개변수로 포함합니다.

OIDC 제공자는 사전에 등록된 URI 목록을 기준으로 redirect_uri를 확인합니다. 불일치가 있으면 invalid_redirect_uri 오류가 반환되어, 인증되지 않은 엔드포인트가 토큰을 수신하는 것을 방지합니다.

Redirect URI의 모범 사례#

실제 사용 사례에서 일반적인 모범 사례는 전용 "Callback" 페이지를 선언하고 외부에서 직접 액세스할 수 있도록 하는 라우터/딥 링크를 연관시키는 것입니다. 이 링크는 redirect URI로 사용해야 합니다.

싱글 페이지 웹 앱이 https://my-app.com에서 실행 중인 경우, 대개 redirect URI는 https://my-app.com/callback으로 선언됩니다.

또는 네이티브 모바일 앱인 경우, redirect URI는 일반적으로 사용자 정의 스키마로 시작합니다. 예를 들어 com.company://myapp/callback

다른 모범 사례는 다음과 같습니다:

• 와일드카드 피하기: redirect URI에서 와일드카드 패턴을 사용하지 마세요. 허용된 모든 URI를 명시적으로 나열하여 인증되지 않은 액세스를 방지하세요.
• 정확히 일치: redirect URI가 OIDC 제공자에 등록된 것과 정확히 일치하는지 확인하세요. 끝에 슬래시라도 있는 경우 불일치가 발생할 수 있습니다.

로그인 콜백 처리하기#

redirect_uri로 반환된 인증 코드를 처리하려면 다음 단계를 따르세요:

1. 인증 코드 추출: redirect URI의 쿼리 문자열에서 코드 매개변수를 가져옵니다.

2. 토큰으로 인증 코드 교환: OIDC 제공자의 토큰 엔드포인트에 POST 요청을 작성하여 다음을 포함합니다:

   • client_id: OIDC 제공자에서 애플리케이션의 ID
   • code: redirect URI에서 받은 인증 코드
   • code_verifier: 클라이언트에서 생성된 임의의 문자열
   • redirect_uri: 인증 요청에서 사용한 것과 동일한 URI
   • grant_type: 보조금 유형, 일반적으로 authorization_code

JavaScript에서 샘플 토큰 교환 요청#

Logto SDK를 사용하여 코드 교환 프로세스 단순화하기#

Logto SDK는 특정 프로그래밍 언어 또는 프레임워크로 작성된 개발 키트입니다. 예: Logto React SDK, Next.js SDK 및 Swift SDK. SDK를 사용하면 단지 하나 또는 두 개의 함수 호출로 간편해집니다.

여기 Logto 공식 React SDK를 사용한 React "Callback" 컴포넌트 샘플이 있습니다:

SDK 통합 가이드는 Logto quick-starts docs에서 확인할 수 있습니다.

요약: OIDC에서 Redirect URI를 마스터해야 하는 이유#

Authorization Code Flow와 함께 OIDC에서 Redirect URI를 이해하는 것은 인증 프로세스를 보호하고 최적화하는 데 중요합니다. 신뢰할 수 있는 redirect URI를 등록하고 로그인 콜백을 효율적으로 처리함으로써 개발 노력을 Logto SDK로 단순화하여 사용자에게 원활하고 안전한 경험을 제공할 수 있습니다.