Azure AD B2C を使用して Azure Web アプリで認証を構成する

重要

2025 年 5 月 1 日より、Azure AD B2C は新規のお客様向けに購入できなくなります。 詳細については、FAQ を参照してください。

この記事では、Azure Active Directory B2C (Azure AD B2C) 認証機能を Azure Web アプリに追加する方法について説明します。 詳細については、 OpenID Connect プロバイダーを使用してログインするように App Service または Azure Functions アプリを構成する に関する記事を参照してください。

概要

OpenID Connect (OIDC) は、OAuth 2.0 を基盤にした認証プロトコルです。 OIDC を使用して、ユーザーを Azure Web アプリに安全にサインインします。 サインイン フローでは、次の手順が実行されます。

1. ユーザーは Azure Web アプリに移動し、[ サインイン] を選択します。
2. Azure Web アプリは認証要求を開始し、ユーザーを Azure AD B2C にリダイレクトします。
3. ユーザーがサインアップまたはサインインし、パスワードをリセットします。 ソーシャル アカウントを使用してサインインすることもできます。
4. ユーザーが正常にサインインすると、Azure AD B2C は AZURE Web アプリに ID トークンを返します。
5. Azure Web App は、ID トークンを検証し、要求を読み取り、セキュリティで保護されたページをユーザーに返します。

ID トークンの有効期限が切れるか、アプリ セッションが無効になると、Azure Web App は新しい認証要求を開始し、ユーザーを Azure AD B2C にリダイレクトします。 Azure AD B2C SSO セッションがアクティブである場合、Azure AD B2C は、ユーザーに再度サインインを促さずにアクセス トークンを発行します。 Azure AD B2C セッションが有効期限切れまたは無効になった場合、ユーザーは再度サインインするように促されます。

[前提条件]

• アプリをまだ作成していない場合は、 Azure Web アプリの作成方法に関するガイダンスに従ってください。

手順 1: ユーザー フローを構成する

ユーザーがアプリにサインインしようとすると、ユーザー フローを介した承認エンドポイントへの認証要求がアプリによって開始されます。 ユーザー フローによって、ユーザーのエクスペリエンスが定義および制御されます。 ユーザーがユーザー フローを完了すると、Azure AD B2C によってトークンが生成され、ユーザーはアプリケーションにリダイレクトされます。

ユーザー フローまたはカスタム ポリシーの作成をまだ行っていない場合は、作成します。 手順を繰り返して、次のように 3 つの個別のユーザー フローを作成します。

• サインインと サインアップを結合したユーザー フロー (例:)susi。 このユーザー フローでは、パスワードを忘れた 場合のエクスペリエンスもサポート されています。
• プロファイル編集 ユーザー フロー (例: edit_profile) 。
• パスワードのリセット ユーザー フロー (例: reset_password)。

Azure AD B2C は、 B2C_1_ ユーザー フロー名の前に付加されます。 たとえば、susi が B2C_1_susiになります。

手順 2: Web アプリケーションを登録する

アプリケーションが Azure AD B2C でサインインできるようにするには、Azure AD B2C ディレクトリにアプリを登録します。 アプリを登録すると、アプリと Azure AD B2C の間に信頼関係が確立されます。

アプリの登録時に、 リダイレクト URI を指定します。 リダイレクト URI は、ユーザーが Azure AD B2C で認証を行った後、Azure AD B2C によってリダイレクトされるエンドポイントです。 アプリ登録プロセスは、アプリを一意に識別するアプリケーション ID (またはクライアント ID として知られています) を生成します。 アプリが登録されると、Azure AD B2C はアプリケーション ID とリダイレクト URI の両方を使用して認証要求を作成します。 また、トークンを安全に取得するためにアプリが使用するクライアント シークレットも作成します。

手順 2.1: アプリを登録する

アプリケーションを登録するには、次の手順に従います。

1. Azure portal にサインインします。

2. 複数のテナントにアクセスできる場合、上部のメニューの [設定] アイコンを選択し、[ディレクトリとサブスクリプション] メニューからお使いの Azure AD B2C テナントに切り替えます。

3. Azure portal で、 [Azure AD B2C] を検索して選択します。

4. [アプリの登録] を選択し、[新しい登録] を選択します。

5. [ 名前] に、アプリケーションの名前 (例: My Azure Web アプリ) を入力します。

6. [サポートされているアカウントの種類] で、[(ユーザー フローを使用してユーザーを認証するための) 任意の ID プロバイダーまたは組織のディレクトリのアカウント] を選択します。

7. [リダイレクト URI] で、 [Web] を選択し、URL ボックスに「https://<YOUR_SITE>/.auth/login/aadb2c/callback」と入力します。 <YOUR_SITE>を Azure Web アプリ名に置き換えます。 たとえば、 https://contoso.azurewebsites.net/.auth/login/aadb2c/callbackと指定します。 Azure Web アプリのカスタム ドメインを構成した場合は、リダイレクト URI でカスタム ドメインを使用します。 たとえば、https://www.contoso.com/.auth/login/aadb2c/callback のように指定します。

8. [アクセス許可] で、 [Grant admin consent to openid and offline access permissions](OpenID とオフラインのアクセス許可に管理者の同意を与える) チェック ボックスをオンにします。

9. 登録 を選択します。

10. [概要] を選択します。

11. アプリケーション (クライアント) ID を記録しておきます。これは、後で Web アプリケーションを構成するときに使用します。

    

手順 2.2: クライアント シークレットを作成する

1. [Azure AD B2C - アプリの登録] ページで、作成したアプリケーション (マイ Azure Web アプリなど) を選択します。
2. 左側のメニューの [ 管理] で、[ 証明書とシークレット] を選択します。
3. 新しいクライアント シークレットを選択します。
4. [説明] ボックスに、クライアント シークレットの説明を入力します。 たとえば、clientsecret1 のようにします。
5. [有効期限] で、シークレットが有効な期間を選択してから、 [追加] を選択します。
6. クライアント アプリケーションのコードで使用できるように、シークレットの値を記録します。 このページからの移動後は、このシークレットの値は "二度と表示されません"。 アプリケーションのコード内で、この値をアプリケーション シークレットとして使用します。

手順 3: Azure アプリを構成する

1. Azure portal にサインインします。

2. 複数のテナントにアクセスできる場合は、上部メニューの [設定] アイコンを選択して、[ ディレクトリ + サブスクリプション ] メニューから Microsoft Entra ID テナントに切り替えます。

3. Azure Web アプリに移動します。

4. 左側のメニューで [ 認証 ] を選択します。 IDプロバイダーを追加を選択します。

5. ID プロバイダーのドロップダウンから [OpenID Connect] を選びます。

6. [OpenID プロバイダー名] に「aadb2c」と入力します。

7. [メタデータエントリ] で、[ドキュメントの URL] を選択します。 次に、[ ドキュメントの URL ] に次の URL を指定します。

   https://<TENANT_NAME>.b2clogin.com/<TENANT_NAME>.onmicrosoft.com/<POLICY_NAME>/v2.0/.well-known/openid-configuration
   

   1. <TENANT_NAME> を、Azure AD B2C テナント名の最初の部分に置き換えます (例: https://contoso.b2clogin.com/contoso.onmicrosoft.com)。 カスタムドメインを設定している場合は、そのカスタムドメインを使用できます。 認証要求 URL の B2C テナント名 contoso.onmicrosoft.com をテナント ID GUID に置き換えます。 たとえば、 https://fabrikamb2c.b2clogin.com/contoso.onmicrosoft.com/ を https://account.contosobank.co.uk/<tenant ID GUID>/ に変更できます。

   2. <POLICY_NAME>を、手順 1 で作成したユーザー フローまたはカスタム ポリシーに置き換えます。

8. [クライアント ID] には、手順 2.1 の Web アプリ (クライアント) ID を入力します。

9. [Client Secret] には、手順 2.2 の Web アプリ (クライアント) シークレットを指定します。

   ヒント

   クライアント シークレットはアプリ設定として保存され、シークレットは安全な方法で確実に格納されます。 Azure Key Vault でシークレットを管理する場合は、Key Vault 参照を使用するように、この設定を後で更新することができます。

10. 残りの設定はデフォルト値のままにします。

11. [追加] ボタンを選んで、ID プロバイダーの設定を完了します。

手順 4: Azure Web アプリを確認する

1. ブラウザーで、 https://<app-name>.azurewebsites.net を使用して Azure Web アプリに移動します。 <app-name> を実際の Azure Web アプリに置き換えます。
2. サインアップまたはサインイン プロセスを完了します。
3. ブラウザで、次のURL https://<app-name>.azurewebsites.net/.auth/me に移動して、サインインしているユーザーに関する情報を表示します。 <app-name> を実際の Azure Web アプリに置き換えます。

アプリ コードでのトークンの取得

サーバー コードからプロバイダー固有のトークンが要求ヘッダーに挿入されるので、これらのトークンに簡単にアクセスできます。 次の表は、可能なトークン ヘッダー名を示しています。

ヘッダー名	説明
X-MS-クライアント-PRINCIPAL-NAME	ユーザーの表示名。
X-MS-クライアント-PRINCIPAL-ID	ID トークン サブ要求。
X-MS-クライアント-PRINCIPAL-IDP	ID プロバイダー名 aadb2c。
X-MS-TOKEN-AADB2C-ID-TOKEN	Azure AD B2C によって発行された ID トークン

次のステップ

• 認証が成功すると、ナビゲーション バーに表示名を表示できます。 Azure AD B2C トークンによってアプリに返される要求を表示するには、「Azure App Service 認証でユーザー ID を操作する」を参照してください。
• Azure App Service 認証で OAuth トークンを操作する方法について説明します。