Azure AD B2C を使用して Azure Web App 構成ファイルで認証を構成する

2025-05-07

重要

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

この記事では、Azure Active Directory B2C (Azure AD B2C) 認証機能を Azure Web アプリに追加する方法について説明します。詳細については、 Azure App Service 認証のファイルベースの構成に関する記事を参照してください。

概要

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

ユーザーは Azure Web アプリに移動し、[ サインイン] を選択します。
Azure Web アプリは認証要求を開始し、ユーザーを Azure AD B2C にリダイレクトします。
ユーザーがサインアップまたはサインインし、パスワードをリセットします。ソーシャルアカウントを使用してサインインすることもできます。
ユーザーが正常にサインインすると、Azure AD B2C は AZURE Web アプリに ID トークンを返します。
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: アプリを登録する

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

Azure portal にサインインします。
複数のテナントにアクセスできる場合、上部のメニューの [設定] アイコンを選択し、[ディレクトリとサブスクリプション] メニューからお使いの Azure AD B2C テナントに切り替えます。
Azure portal で、 [Azure AD B2C] を検索して選択します。
[アプリの登録] を選択し、[新しい登録] を選択します。
[ 名前] に、アプリケーションの名前 (例: My Azure Web アプリ) を入力します。
[サポートされているアカウントの種類] で、[(ユーザーフローを使用してユーザーを認証するための) 任意の ID プロバイダーまたは組織のディレクトリのアカウント] を選択します。
[リダイレクト 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 のように指定します。
[アクセス許可] で、 [Grant admin consent to openid and offline access permissions](OpenID とオフラインのアクセス許可に管理者の同意を与える) チェックボックスをオンにします。
登録を選択します。
[概要] を選択します。
アプリケーション (クライアント) ID を記録しておきます。これは、後で Web アプリケーションを構成するときに使用します。

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

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

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

アプリケーションが Azure AD B2C に登録されたら、Azure Web アプリのアプリケーション設定で次のアプリケーションシークレットを作成します。アプリケーション設定を構成するには、Azure portal または Azure CLI を使用します。詳細については、 Azure App Service 認証のファイルベースの構成に関する記事を参照してください。

アプリ設定に次のキーを追加します。

設定の名前	価値
`AADB2C_PROVIDER_CLIENT_ID`	手順 2.1 の Web アプリ (クライアント) ID。
`AADB2C_PROVIDER_CLIENT_SECRET`	手順 2.2 の Web アプリ (クライアント) シークレット。

重要

アプリケーションシークレットは機密性の高いセキュリティ資格情報です。このシークレットを他のユーザーと共有しないでください。クライアントアプリケーション内で配布したり、ソース管理にチェックインしたりしないでください。

3.1 OpenID Connect ID プロバイダーを追加する

アプリ ID とシークレットを追加したら、次の手順に従って、Azure AD B2C を OpenId Connect ID プロバイダーとして追加します。

authの auth セクションに、OICD プロバイダーの構成ブロックとプロバイダー定義を追加します。

{
  "auth": {
    "identityProviders": {
      "customOpenIdConnectProviders": {
        "aadb2c": {
          "registration": {
            "clientIdSettingName": "AADB2C_PROVIDER_CLIENT_ID",
            "clientCredential": {
              "clientSecretSettingName": "AADB2C_PROVIDER_CLIENT_SECRET"
            },
            "openIdConnectConfiguration": {
              "wellKnownOpenIdConfiguration": "https://<TENANT_NAME>.b2clogin.com/<TENANT_NAME>.onmicrosoft.com/<POLICY_NAME>/v2.0/.well-known/openid-configuration"
            }
          },
          "login": {
            "nameClaimType": "http://schemas.xmlsoap.org/ws/2005/05/identity/claims/name",
            "scopes": [],
            "loginParameterNames": []
          }
        }
      }
    }
  }
}

<TENANT_NAME> を、Azure AD B2C テナント名の最初の部分に置き換えます (例: https://contoso.b2clogin.com/contoso.onmicrosoft.com)。
<POLICY_NAME> を、手順 1 で作成したユーザーフローまたはカスタムポリシーに置き換えます。

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

Azure Web アプリに移動します。
サインアップまたはサインインプロセスを完了します。
ブラウザーで次の 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 トークンを操作する方法について説明します。

次の方法で共有

Azure AD B2C を使用して Azure Web App 構成ファイルで認証を構成する

概要

[前提条件]

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

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

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

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

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

3.1 OpenID Connect ID プロバイダーを追加する

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

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

関連コンテンツ

フィードバック

その他のリソース

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

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

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