リダイレクト URI と OpenID Connect (OIDC) の認可コードフローを理解する

リダイレクト URI とは？#

リダイレクト URI（返信 URL とも呼ばれる）は、OIDC 認証プロセスにおける重要なセキュリティコンポーネントです。ユーザーが OIDC プロバイダーを通じて正常にサインインした後に送信される URL を指定します。さらに重要なのは、アプリケーションがトークンを取得するために必要な認可コードを受け取る場所です。

詳細は リダイレクト URI ウィキを参照してください。

認可コードフローとは？#

認可コードフロー（OAuth 2.0 RFC 6749, セクション 4.1で定義）は、OIDC における基本的な認証方法です。これは、認可コードをアクセス トークンおよびオプションでリフレッシュ トークンと交換することを含みます。このフローは、クライアントシークレットを安全に保持できるサーバーサイド Web アプリケーションなどのアプリケーションに適しています。

詳細は 認可コードフロー ウィキを参照してください。

認可コードフローにおけるリダイレクト URI の機能は？#

認可コードフローでは、リダイレクト URI は、ユーザーが正常に認証された後に OIDC プロバイダーが認可コードを送信する宛先です。それは OIDC プロバイダーと事前に登録される必要があり、セキュリティを確保し、不正なリダイレクトを防ぎます。

Logto コンソールでリダイレクト URI を登録する方法は以下のとおりです：

サインインを開始する際：

1. 認可リクエスト: アプリケーションは、client_id, response_type, scope および redirect_uri などのパラメーターを含めて、ユーザーを OIDC プロバイダーの認可エンドポイントに向けます。
2. ユーザー認証: ユーザーは OIDC プロバイダーで認証を行います。
3. 認可コードの送信: 認証が成功すると、OIDC プロバイダーは、redirect_uri に認可コードをクエリパラメーターとして含めてリダイレクトします。

OIDC プロバイダーは、redirect_uri を事前に登録された URI のリストと照合します。一致しない場合、invalid_redirect_uri エラーを返し、トークンの不正入手を防止することによりセキュリティを強化します。

リダイレクト URI のベストプラクティス#

実際の使用例では、一般的なベストプラクティスとして、専用の「コールバック」ページを宣言し、外部からの直接アクセスを許可するルーター / ディープリンクを関連付けます。このリンクをリダイレクト URI として使用する必要があります。

単一ページ Web アプリが https://my-app.com で実行されていると仮定すると、通常、リダイレクト URI は https://my-app.com/callback として宣言されます。

また、ネイティブなモバイルアプリの場合、リダイレクト URI は通常、カスタムスキームから始まります。例：com.company://myapp/callback

その他のベストプラクティスには以下が含まれます：

• ワイルドカードを避ける: リダイレクト URI にワイルドカードパターンを使用しないでください。不正アクセスを防ぐため、許可されたすべての URI を明示的にリストしてください。
• 完全に一致させる: リダイレクト URI が OIDC プロバイダーに登録されたものと完全に一致するようにしてください。トレーリングスラッシュの有無でも不一致を引き起こす可能性があります。

サインイン コールバックの処理#

redirect_uri に返された認可コードを処理するには、次の手順を実行します：

1. 認可コードを抽出: リダイレクト URI のクエリ文字列からコードパラメーターを取得します。

2. 認可コードをトークンに交換: OIDC プロバイダーのトークンエンドポイントに対して以下を含めた POST リクエストを構成します：

   • client_id: OIDC プロバイダー内のアプリケーションの ID
   • code: リダイレクト URI から受け取った認可コード
   • code_verifier: クライアントで生成されたランダムな文字列
   • redirect_uri: 認可リクエストに使用された URI
   • grant_type: 通常 authorization_code のような認可のタイプ

JavaScript でのトークン交換リクエストのサンプル#

Logto SDK を活用してコード交換プロセスを簡素化する#

Logto SDK は、特定のプログラミング言語またはフレームワークで記述された開発キットです。例：Logto React SDK、Next.js SDK、Swift SDK を使用すると、1 つまたは 2 つの関数を呼び出すだけで大幅に簡素化できます。

Logto 公式 React SDK を使用した React の「コールバック」コンポーネントのサンプルを示します：

SDK 統合ガイドは Logto クイックスタート ドキュメントにあります。

おさらい：OIDC におけるリダイレクト URI を習得することの重要性#

認可コードフローでの OIDC のリダイレクト URI を理解することは、認証プロセスを確保し最適化するために重要です。信頼されたリダイレクト URI を登録し、サインイン コールバックを効率的に処理することで、ユーザーにシームレスで安全な体験を提供し、Logto SDK を使用して開発作業を簡素化できます。