チュートリアル: Azure Active Directory B2C でユーザー フローとカスタム ポリシーを作成する

ユーザー フローを使用することで、ユーザーがサインイン、サインアップ、プロファイルの編集、パスワードのリセットなどを行うときに、アプリケーションとどのように対話するかを決定できます。 この記事では、次のことについて説明します。

カスタム ポリシーは、Azure Active Directory B2C (Azure AD B2C) テナントの動作を定義する構成ファイルです。 この記事では、次の方法について説明します。

• まだ持っていない場合は、お使いの Azure サブスクリプションにリンクされている Azure AD B2C テナントを作成します。
• Web アプリケーションを登録し、ID トークンの暗黙的な許可を有効にします。

• まだ持っていない場合は、お使いの Azure サブスクリプションにリンクされている Azure AD B2C テナントを作成します。
• Web アプリケーションを登録し、ID トークンの暗黙的な許可を有効にします。

サインアップとサインイン ユーザー フローを作成する

サインアップとサインイン ユーザー フローは、サインアップ エクスペリエンスとサインイン エクスペリエンスの両方を 1 つの構成で処理します。 アプリケーションのユーザーは、状況に応じて正しいパスに誘導されます。

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

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

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

4. [ポリシー] で、 [ユーザー フロー] を選択し、 [新しいユーザー フロー] を選択します。

   

5. [ユーザー フローを作成する] ページで、 [サインアップとサインイン] ユーザー フローを選択します。

   

6. [バージョンの選択] で [Recommended]\(推奨\) を選択して、 [作成] を選択します。 (ユーザー フローのバージョンに関する詳細情報)。

   

7. ユーザー フローの [名前] を入力します。 たとえば、「signupsignin1」と入力します。

8. [ID プロバイダー] の [電子メールのサインアップ] を選択します。

9. [ユーザー属性とトークン要求] で、サインアップ中にユーザーから収集して送信する要求と属性を選択します。 たとえば、 [Show more](さらに表示) を選択し、 [国/リージョン] 、 [表示名] 、 [郵便番号] の属性と要求を選択します。 [OK] を選択します。

   

10. [作成] を選択して、ユーザー フローを追加します。 B2C_1_ というプレフィックスが自動的に名前に追加されます。

ユーザー フローをテストする

1. 作成したユーザー フローを選択してその概要ページを開きます。

2. ユーザー フローの [概要] ページの上部にある [ユーザー フローを実行します] を選択します。 ページの右側にウィンドウが開きます。

3. [アプリケーション] で、テストする Web アプリケーション (webapp1 という名前のアプリケーションなど) を選択します。 [応答 URL] に https://jwt.ms と表示されます。

4. [ユーザー フローを実行します] を選択してから、[今すぐサインアップ] を選択します。

   

5. 有効なメール アドレスを入力し、[確認コードの送信] を選択します。受信した確認コードを入力し、[コードの確認] を選択します。

6. 新しいパスワードを入力し、そのパスワードを確認します。

7. 国とリージョンを選択し、表示する名前を入力し、郵便番号を入力したら、[作成] を選択します。 トークンが https://jwt.ms に返され、表示されます。

8. これでユーザー フローをもう一度実行できるようになりました。作成したアカウントでサインインできる必要があります。 返されたトークンには、選択した国/リージョン、名前、および郵便番号の要求が含まれています。

セルフサービス パスワード リセットを有効にする

サインアップまたはサインインのユーザー フローでセルフサービス パスワード リセットを有効にするには:

1. 作成した、サインアップまたはサインインのユーザー フローを選択します。
2. 左側のメニューの [設定] で、 [プロパティ] を選択します。
3. [Password configuration](パスワードの構成) で、 [セルフサービス パスワード リセット] を選択します。
4. [保存] を選択します。

ユーザー フローをテストする

1. 作成したユーザー フローを選択してその概要ページを開き、 [ユーザー フローの実行] を選択します。
2. [アプリケーション] で、テストする Web アプリケーション (webapp1 という名前のアプリケーションなど) を選択します。 [応答 URL] に https://jwt.ms と表示されます。
3. [ユーザー フローを実行します] を選択します。
4. サインアップまたはサインインのページで、 [パスワードを忘れた場合] を選択します。
5. 前に作成したアカウントの電子メール アドレスを確認してから、 [続行] を選択します。
6. これで、ユーザーのパスワードを変更できるようになりました。 パスワードを変更し、 [続行] を選択します。 トークンが https://jwt.ms に返され、表示されます。

プロファイル編集ユーザー フローを作成する

アプリケーションでユーザーによるプロファイル編集を有効にする場合は、プロファイル編集ユーザー フローを使用します。

1. Azure AD B2C テナントの [概要] ページのメニューで、 [ユーザー フロー] を選択し、 [新しいユーザー フロー] を選択します。
2. [ユーザー フローを作成する] ページで、 [プロファイル編集] ユーザー フローを選択します。
3. [バージョンの選択] で [Recommended](推奨) を選択して、 [作成] を選択します。
4. ユーザー フローの [名前] を入力します。 たとえば、「profileediting1」と入力します。
5. ID プロバイダーの場合は、[ローカル アカウント] の下にある [電子メールのサインアップ] を選択します。
6. [ユーザー属性] で、ユーザーが自分のプロファイルで編集できる属性を選択します。 たとえば、 [Show more](さらに表示) を選択し、 [表示名] と [役職] の属性と要求を選択します。 [OK] を選択します。
7. [作成] を選択して、ユーザー フローを追加します。 B2C_1_ というプレフィックスが自動的に名前に追加されます。

ユーザー フローをテストする

1. 作成したユーザー フローを選択してその概要ページを開きます。
2. ユーザー フローの [概要] ページの上部にある [ユーザー フローを実行します] を選択します。 ページの右側にウィンドウが開きます。
3. [アプリケーション] で、テストする Web アプリケーション (webapp1 という名前のアプリケーションなど) を選択します。 [応答 URL] に https://jwt.ms と表示されます。
4. [ユーザー フローを実行します] を選択し、以前に作成したアカウントでサインインします。
5. これで、ユーザーの表示名と役職を変更できるようになりました。 [続行] をクリックします。 トークンが https://jwt.ms に返され、表示されます。

Identity Experience Framework アプリケーションに署名および暗号化キーを追加する

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

署名キーを作成します。

1. [ポリシー キー] を選択し、 [追加] を選択します。
2. オプションについては、Generateを選択します。
3. 名前にTokenSigningKeyContainerを入力します。 プレフィックス B2C_1A_ が自動的に追加される場合があります。
4. キー タイプについては、RSA を選択します。
5. [キー使用法] には [署名] を選択します。
6. ［作成］ を選択します

暗号化キーを作成します。

1. [ポリシー キー] を選択し、 [追加] を選択します。
2. オプションについては、Generateを選択します。
3. 名前にTokenEncryptionKeyContainerを入力します。 プレフィックス B2C_1A_ が自動的に追加される場合があります。
4. キー タイプについては、RSA を選択します。
5. [キー使用法] には [暗号化] を選択します。
6. ［作成］ を選択します

Identity Experience Framework アプリケーションを登録する

Azure AD B2C では、ローカル アカウントでのユーザーのサインアップとサインインのために使用する 2 つのアプリケーションを登録する必要があります。IdentityExperienceFramework (Web API) と、IdentityExperienceFramework アプリへのアクセス許可が委任された ProxyIdentityExperienceFramework (ネイティブ アプリ) です。 ユーザーはメール アドレスまたはユーザー名およびパスワードを使用してサインアップし、テナントに登録されたアプリケーションにアクセスできます。これにより "ローカル アカウント" が作成されます。ローカル アカウントは、Azure AD B2C テナント内にのみ存在します。

この 2 つのアプリケーションを Azure AD B2C テナントに 1 回だけ登録する必要があります。

IdentityExperienceFramework アプリケーションを登録します

Azure AD B2C テナントにアプリケーションを登録するには、アプリの登録エクスペリエンスを使用できます。

1. [アプリの登録] を選択し、 [新規登録] を選択します。
2. 名前には、IdentityExperienceFrameworkを入力します。
3. [サポートされているアカウントの種類] で、 [この組織のディレクトリ内のアカウントのみ] を選択します。
4. [リダイレクト URI] で [Web] を選択し、「https://your-tenant-name.b2clogin.com/your-tenant-name.onmicrosoft.com」と入力します。your-tenant-name は、Azure AD B2C テナント ドメイン名です。
5. [アクセス許可] で、 [openid と offline_access アクセス許可に対して管理者の同意を付与します] チェック ボックスをオンにします。
6. [登録] を選択します。
7. 後の手順で使用するために、アプリケーション (クライアント) ID を記録しておきます。

次に、スコープを追加して API を公開します。

1. 左側のメニューの [管理] で、 [API の公開] を選択します。
2. [スコープの追加] 、 [保存して続行] の順に選択し、既定のアプリケーション ID URI をそのまま使用します。
3. 次の値を入力して、ご自身の Azure AD B2C テナントでカスタム ポリシーの実行を許可するスコープを作成します。
   • スコープ名: user_impersonation
   • 管理者の同意の表示名: Access IdentityExperienceFramework
   • 管理者の同意の説明: Allow the application to access IdentityExperienceFramework on behalf of the signed-in user.
4. [スコープの追加] を選択します

ProxyIdentityExperienceFramework アプリケーションを登録する

1. [アプリの登録] を選択し、 [新規登録] を選択します。
2. 名前には、ProxyIdentityExperienceFrameworkを入力します。
3. [サポートされているアカウントの種類] で、 [この組織のディレクトリ内のアカウントのみ] を選択します。
4. [リダイレクト URI] で、ドロップダウンを使用して [パブリック クライアント/ネイティブ (モバイルとデスクトップ)] を選択します。
5. [リダイレクト URI] に「myapp://auth」と入力します。
6. [アクセス許可] で、 [openid と offline_access アクセス許可に対して管理者の同意を付与します] チェック ボックスをオンにします。
7. [登録] を選択します。
8. 後の手順で使用するために、アプリケーション (クライアント) ID を記録しておきます。

次に、アプリケーションをパブリック クライアントとして扱うよう指定します。

1. 左側のメニューの [管理] セクションで、 [認証] を選択します。
2. [詳細設定] の [パブリック クライアント フローを許可する] セクションで、 [次のモバイルとデスクトップのフローを有効にする] を [はい] に設定します。
3. [保存] を選択します。
4. "allowPublicClient": true がアプリケーション マニフェストで確実に設定されているようにします。
   1. 左側のメニューの [管理] で [マニフェスト] を選択し、アプリケーション マニフェストを開きます
   2. allowPublicClient キーを見つけ、その値が true に設定されていることを確認します。

次に、IdentityExperienceFramework 登録で前に公開した API スコープに、アクセス許可を付与します。

1. 左側のメニューの [管理] で、 [API のアクセス許可] を選択します。
2. [構成されたアクセス許可] の下で [アクセス許可の追加] を選択します。
3. [自分の API] タブ、IdentityExperienceFramework アプリケーションの順に選択します。
4. [アクセス許可] で、前に定義した [user_impersonation] スコープを選択します。
5. [アクセス許可の追加] を選択します. 指示に従って、数分待ってから次の手順に進みます。
6. [<テナント名> に管理者の同意を与えます] を選択します。
7. [はい] を選択します。
8. [最新の情報に更新] を選択し、スコープの [状態] に、"Granted for ..." (... に付与されました) と表示されていることを確認します。

カスタム ポリシー スターター パック

カスタム ポリシーは、技術プロファイルとユーザー体験を定義するために Azure AD B2C テナントにアップロードされる XML ファイルのセットです。 すぐに作業を開始できるように、いくつかの事前に作成されたポリシーが含まれているスターターパックが用意されています。 これらの各スターター パックには、説明したシナリオを実現するために必要な最小数の技術プロファイルとユーザー体験が含まれています。

• LocalAccounts - ローカル アカウントのみの使用を可能にします。
• SocialAccounts - ソーシャル (フェデレーション) アカウントのみの使用を可能にします。
• SocialAndLocalAccounts - ローカル アカウントとソーシャル アカウントの両方の使用を可能にします。
• SocialAndLocalAccountsWithMFA - ソーシャル、ローカル、および多要素認証オプションの使用を可能にします。

各スターター パックには以下が含まれています。

• ベース ファイル - ベースにはいくつかの変更が必要です。 例:TrustFrameworkBase.xml
• ローカライズ ファイル - このファイルは、ローカライズの変更が実行される場所です。 例: TrustFrameworkLocalization.xml
• 拡張ファイル - このファイルは、構成変更の大半が実行される場所です。 例:TrustFrameworkExtensions.xml
• 証明書利用者ファイル - アプリケーションによって呼び出される、タスク固有のファイルです。 例 :SignUpOrSignin.xml、ProfileEdit.xml、PasswordReset.xml

この記事では、SocialAndLocalAccounts スターター パック内の XML カスタム ポリシー ファイルを編集します。 XML エディターが必要な場合は、軽量のクロスプラットフォーム エディターである Visual Studio Code をお試しください。

スターター パックを取得する

GitHub からカスタム ポリシー スターター パックを取得し、SocialAndLocalAccounts スターター パック内の XML ファイルの名前を Azure AD B2C テナントの名前に更新します。

1. .zip ファイルをダウンロードするか、リポジトリを複製します。

   git clone https://github.com/Azure-Samples/active-directory-b2c-custom-policy-starterpack
   

2. SocialAndLocalAccounts ディレクトリ内のすべてのファイルで、yourtenant 文字列を Azure AD B2C テナントの名前に置き換えます。

   たとえば、B2C テナントの名前が contosotenantであれば、yourtenant.onmicrosoft.com のすべてのインスタンスは contosotenant.onmicrosoft.com になります。

カスタム ポリシーにアプリケーション ID を追加します。

拡張子ファイル TrustFrameworkExtensions.xml にアプリケーション ID を追加します。

1. SocialAndLocalAccounts/TrustFrameworkExtensions.xml を開いて、<TechnicalProfile Id="login-NonInteractive"> 要素を見つけます。
2. IdentityExperienceFrameworkAppId の両方のインスタンスを、前に作成した IdentityExperienceFramework アプリケーションのアプリケーション ID に置き換えます。
3. ProxyIdentityExperienceFrameworkAppId の両方のインスタンスを、前に作成した ProxyIdentityExperienceFramework アプリケーションのアプリケーション ID に置き換えます。
4. ファイルを保存します。

Facebook を ID プロバイダーとして追加する

SocialAndLocalAccounts スターター パックには、Facebook のソーシャル サインインが含まれています。 Facebook はカスタム ポリシーを使用するための必須条件ではありませんが、ここではカスタム ポリシーでソーシャル ログインを連携できることを示す目的で使用されています。 フェデレーション ソーシャル ログインを有効にする必要がない場合は、代わりに LocalAccounts スターター パックを使用し、[Facebook を ID プロバイダーとして追加する] セクションをスキップします。

Facebook アプリケーションを作成する

「Facebook アプリケーションの作成」で説明した手順を使用して、Facebook の "アプリ ID" と "アプリ シークレット" を取得します。 「Facebook アカウントでのサインアップおよびサインインを設定する」に記載されている前提条件と残りの手順はスキップしてください。

Facebook のキーを作成します。

ポリシー キーとして、Facebook アプリケーションの [アプリ シークレット]を追加します。 この記事の前提条件の一部として作成したアプリケーションのアプリ シークレットを使用できます。

1. Azure portal にサインインします。
2. 複数のテナントにアクセスできる場合、上部のメニューの [設定] アイコンを選択し、[ディレクトリとサブスクリプション] メニューからお使いの Azure AD B2C テナントに切り替えます。
3. Azure portal で、 [Azure AD B2C] を検索して選択します。
4. [概要] ページで、 [ポリシー] を選択してから [Identity Experience Framework] を選択します。
5. [ポリシー キー] を選択し、 [追加] を選択します。
6. オプションについては、Manualを選択します。
7. 名前には、FacebookSecretを入力します。 プレフィックス B2C_1A_ が自動的に追加される場合があります。
8. シークレットで、developers.facebook.com から Facebook アプリケーションのアプリ シークレットを入力します。 この値はシークレットであり、アプリケーション ID ではありません。
9. [キー使用法] には [署名] を選択します。
10. ［作成］ を選択します

カスタム ポリシー スターター パックの TrustFrameworkExtensions.xml を更新する

SocialAndLocalAccounts/TrustFrameworkExtensions.xml ファイルで client_id の値を Facebook アプリケーションの ID と置き換え、変更を保存します。

<TechnicalProfile Id="Facebook-OAUTH">
  <Metadata>
  <!--Replace the value of client_id in this technical profile with the Facebook app ID"-->
    <Item Key="client_id">00000000000000</Item>

ポリシーをアップロードします。

1. Azure portal で B2C テナントに移動し、 [Identity Experience Framework] を選択します。
2. [カスタム ポリシーのアップロード] を選択します。
3. 次の順序でポリシー ファイルをアップロードします。
   1. TrustFrameworkBase.xml
   2. TrustFrameworkLocalization.xml
   3. TrustFrameworkExtensions.xml
   4. SignUpOrSignin.xml
   5. ProfileEdit.xml
   6. PasswordReset.xml

ファイルをアップロードすると、Azure によって、それぞれに B2C_1A_ が追加されます。

カスタム ポリシーをテストする

1. [カスタム ポリシー] ページで、B2C_1A_signup_signin を選択します。
2. カスタム ポリシーの概要ページにある [アプリケーションの選択] で、テストする Web アプリケーション (webapp1 という名前のアプリケーションなど) を選択します。
3. [返信 URL] が https://jwt.ms であることを確認します。
4. [今すぐ実行] を選択します。
5. メール アドレスを使用してサインアップします。
6. もう一度 [今すぐ実行] を選択します。
7. 同じアカウントでサインインし、構成が正しく行われていることを確認します。
8. 再び [今すぐ実行] を選択し、Facebook でサインインする Facebook を選択し、カスタム ポリシーをテストします。