Azure Active Directory B2C での OAuth 2.0 承認コード フロー

デバイスにインストールされているアプリで OAuth 2.0 認証コード付与を使用して、Web API などの保護されたリソースにアクセスできます。 OAuth 2.0 の Azure Active Directory B2C (Azure AD B2C) 実装を使用すると、シングルページ、モバイル、デスクトップ アプリにサインアップ、サインイン、その他の ID 管理タスクを追加できます。 この記事では、オープンソース ライブラリを使用せずに HTTP メッセージを送受信する方法について説明します。 この記事は言語に依存しません。 可能であれば、サポートされている Microsoft 認証ライブラリ (MSAL) を使用することをお勧めします。 MSAL を使用するサンプル アプリを見てみましょう。

OAuth 2.0 承認コード フローは、 OAuth 2.0 仕様のセクション 4.1で規定されています。 Web アプリケーション、シングルページ アプリケーション、ネイティブにインストールされたアプリケーションなど、ほとんどの アプリケーションの種類で認証と承認に使用できます。 OAuth 2.0 承認コード フローを使用して、アプリケーションのアクセス トークンと更新トークンを安全に取得できます。これを使用して、 承認サーバーによってセキュリティ保護されたリソースにアクセスできます。 更新トークンを使用すると、通常は 1 時間後にアクセス トークンの有効期限が切れると、クライアントは新しいアクセス (および更新) トークンを取得できます。

この記事では、 パブリック クライアント の OAuth 2.0 承認コード フローについて説明します。 パブリック クライアントは、シークレット パスワードの整合性を安全に維持するために信頼できない任意のクライアント アプリケーションです。 これには、シングルページ アプリケーション、モバイル アプリ、デスクトップ アプリケーション、および基本的にサーバー上で実行されないすべてのアプリケーションが含まれます。

Azure AD B2C では、標準の OAuth 2.0 フローが拡張され、単純な認証と承認以上の処理が行われます。 ユーザー フローについて説明します。 ユーザー フローでは、OAuth 2.0 を使用して、サインアップ、サインイン、プロファイル管理などのユーザー エクスペリエンスをアプリケーションに追加できます。 OAuth 2.0 プロトコルを使用する ID プロバイダーには、 Amazon、 Microsoft Entra ID、 Facebook、 GitHub、 Google、 LinkedIn が含まれます。

この記事の HTTP 要求を試すには:

1. {tenant}を Azure AD B2C テナントの名前に置き換えます。
2. 00001111-aaaa-2222-bbbb-3333cccc4444を、以前に Azure AD B2C テナントに登録したアプリケーションのアプリ ID に置き換えます。
3. {policy}は、テナントで作成したポリシーの名前 (b2c_1_sign_inなど) に置き換えます。

シングルページ アプリに必要なリダイレクト URI のセットアップ

シングル ページ アプリケーションの承認コード フローには、追加のセットアップが必要です。 シングルページ アプリケーションを作成する手順に従って、リダイレクト URI を CORS に対して有効として正しくマークします。 CORS を有効にするために既存のリダイレクト URI を更新するには、[アプリの登録] の [認証] タブの [Web] セクションで移行プロンプトをクリックします。または、アプリ登録マニフェスト エディターを開き、リダイレクト URI の type フィールドを spa セクションでreplyUrlsWithTypeに設定することもできます。

spa リダイレクトの種類は、暗黙のフローと後方互換性があります。 トークンを取得するために暗黙的なフローを現在使用しているアプリは、問題なく spa のリダイレクト URI の種類に移行し、暗黙的なフローを引き続き使用することができます。

1. 承認コードを取得する

承認コード フローは、クライアントがユーザーを /authorize エンドポイントにリダイレクトさせることから始まります。 これは、ユーザーがアクションを実行するフローの対話型部分です。 この要求では、クライアントは scope パラメーターで、ユーザーから取得する必要があるアクセス許可を示します。 次の例 (読みやすくするために改行を含む) は、承認コードを取得する方法を示しています。 この GET HTTP 要求をテストする場合は、ブラウザーを使用します。

GET https://{tenant}.b2clogin.com/{tenant}.onmicrosoft.com/{policy}/oauth2/v2.0/authorize?
client_id=00001111-aaaa-2222-bbbb-3333cccc4444
&response_type=code
&redirect_uri=urn%3Aietf%3Awg%3Aoauth%3A2.0%3Aoob
&response_mode=query
&scope=00001111-aaaa-2222-bbbb-3333cccc4444%20offline_access%20https://{tenant-name}/{app-id-uri}/{scope}
&state=arbitrary_data_you_can_receive_in_the_response
&code_challenge=YTFjNjI1OWYzMzA3MTI4ZDY2Njg5M2RkNmVjNDE5YmEyZGRhOGYyM2IzNjdmZWFhMTQ1ODg3NDcxY2Nl
&code_challenge_method=S256

この時点で、ユーザーはユーザー フローのワークフローを完了するように求められます。 これには、ユーザーがユーザー名とパスワードを入力したり、ソーシャル ID でサインインしたり、ディレクトリにサインアップしたり、その他の数の手順を実行したりする必要があります。 ユーザー アクションは、ユーザー フローの定義方法によって異なります。

ユーザーがユーザー フローを完了すると、Microsoft Entra ID は、 redirect_uriに使用した値でアプリへの応答を返します。 response_mode パラメーターで指定されたメソッドを使用します。 応答は、実行されたユーザー フローとは無関係に、各ユーザー アクション シナリオでまったく同じです。

response_mode=queryを使用する正常な応答は次のようになります。

GET urn:ietf:wg:oauth:2.0:oob?
code=AwABAAAAvPM1KaPlrEqdFSBzjqfTGBCmLdgfSTLEMPGYuNHSUYBrq...        // the authorization_code, truncated
&state=arbitrary_data_you_can_receive_in_the_response                // the value provided in the request

エラー応答をリダイレクト URI に送信して、アプリが適切に処理できるようにすることもできます。

GET urn:ietf:wg:oauth:2.0:oob?
error=access_denied
&error_description=The+user+has+cancelled+entering+self-asserted+information
&state=arbitrary_data_you_can_receive_in_the_response

2. アクセス トークンを取得する

承認コードを取得したので、code エンドポイントに POST 要求を送信することで、目的のリソースへのトークンの/tokenを引き換えることができます。 Azure AD B2C では、対応するスコープを要求の中で指定することによって、いつものように他の API のアクセス トークンを要求できます。

アプリのクライアント ID を要求されたスコープとして使用する規則によって、アプリ独自のバックエンド Web API のアクセス トークンを要求することもできます (その結果、そのクライアント ID を "対象ユーザー" として持つアクセス トークンになります)。

POST https://{tenant}.b2clogin.com/{tenant}.onmicrosoft.com/{policy}/oauth2/v2.0/token HTTP/1.1

Content-Type: application/x-www-form-urlencoded

grant_type=authorization_code
&client_id=00001111-aaaa-2222-bbbb-3333cccc4444
&scope=00001111-aaaa-2222-bbbb-3333cccc4444 offline_access
&code=AwABAAAAvPM1KaPlrEqdFSBzjqfTGBCmLdgfSTLEMPGYuNHSUYBrq...
&redirect_uri=urn:ietf:wg:oauth:2.0:oob
&code_verifier=ThisIsntRandomButItNeedsToBe43CharactersLong 

この POST HTTP 要求をテストする場合は、 Microsoft PowerShell などの任意の HTTP クライアントを使用できます。

成功したトークン応答は次のようになります。

{
    "not_before": "1442340812",
    "token_type": "Bearer",
    "access_token": "eyJ0eXAiOiJKV1QiLCJhbGciOiJSUzI1NiIsIng1dCI6Ik5HVEZ2ZEstZnl0aEV1Q...",
    "scope": "00001111-aaaa-2222-bbbb-3333cccc4444 offline_access",
    "expires_in": "3600",
    "refresh_token": "AAQfQmvuDy8WtUv-sd0TBwWVQs1rC-Lfxa_NDkLqpg50Cxp5Dxj0VPF1mx2Z...",
}

エラー応答は次のようになります。

{
    "error": "access_denied",
    "error_description": "The user revoked access to the app.",
}

3. トークンを使用する

アクセス トークンが正常に取得されたので、バックエンド Web API への要求でトークンを Authorization ヘッダーに含めることで使用できます。

GET /tasks
Host: mytaskwebapi.com
Authorization: Bearer eyJ0eXAiOiJKV1QiLCJhbGciOiJSUzI1NiIsIng1dCI6Ik5HVEZ2ZEstZnl0aEV1Q...

4. トークンを更新する

アクセス トークンと ID トークンの有効期限は非常に短いです。 有効期限が切れた後に、リソースに引き続きアクセスできるようにするには、トークンを更新する必要があります。 アクセス トークンを更新すると、Azure AD B2C から新しいトークンが返されます。 更新されたアクセス トークンは、nbf (期間の開始時刻)、iat (発行時刻)、および exp (有効期限) の要求値が更新されます。 他のすべての要求値は、最初に発行されたアクセス トークンと同じです。

トークンを更新するには、 /token エンドポイントに別の POST 要求を送信します。 今回は、refresh_tokenの代わりにcodeを指定します。

POST https://{tenant}.b2clogin.com/{tenant}.onmicrosoft.com/{policy}/oauth2/v2.0/token HTTP/1.1

Content-Type: application/x-www-form-urlencoded

grant_type=refresh_token
&client_id=00001111-aaaa-2222-bbbb-3333cccc4444
&scope=00001111-aaaa-2222-bbbb-3333cccc4444 offline_access
&refresh_token=AwABAAAAvPM1KaPlrEqdFSBzjqfTGBCmLdgfSTLEMPGYuNHSUYBrq...
&redirect_uri=urn:ietf:wg:oauth:2.0:oob

成功したトークン応答は次のようになります。

{
    "not_before": "1442340812",
    "token_type": "Bearer",
    "access_token": "eyJ0eXAiOiJKV1QiLCJhbGciOiJSUzI1NiIsIng1dCI6Ik5HVEZ2ZEstZnl0aEV1Q...",
    "scope": "00001111-aaaa-2222-bbbb-3333cccc4444 offline_access",
    "expires_in": "3600",
    "refresh_token": "AAQfQmvuDy8WtUv-sd0TBwWVQs1rC-Lfxa_NDkLqpg50Cxp5Dxj0VPF1mx2Z...",
}

エラー応答は次のようになります。

{
    "error": "access_denied",
    "error_description": "The user revoked access to the app.",
}

独自の Azure AD B2C ディレクトリを使用する

これらの要求を自分で試すには、次の手順を実行します。 この記事で使用した値の例を独自の値に置き換えます。

1. Azure AD B2C ディレクトリを作成します。 要求でディレクトリの名前を使用します。
2. アプリケーション ID とリダイレクト URI を取得するアプリケーションを作成します。 アプリにネイティブ クライアントを含めます。
3. ユーザー フローを作成 して、ユーザー フロー名を取得します。