クラウドで簡単MFA！Azure AD B2C編（後編）

この記事は、「クラウドで簡単MFA！Azure AD B2C編（前編）」の続きです。

Microsoft Azure上で提供されているサービスである「Azure Active Directory B2C（Azure AD B2C）」を利用した多要素認証（MFA）環境の構築について、前回は、B2Cテナントの作成とアプリケーションの登録までの流れをご紹介しました。

今回は、ユーザーフローを作成し、実際にMFA機能を動かすところまでの手順をご紹介していきたいと思います。

３. ユーザーフローの作成

前編の「アプリケーションの登録」では、認証を要求するアプリに関する設定を行いました。次は、ユーザー登録やユーザー認証などのB2Cテナント側の動作を設定するために「ユーザーフロー」を作成していきます。

B2Cテナントの管理画面を表示して（アプリ設定の直後の場合、右上の「×」をクリックして管理画面に戻ってください）、左のメニューから「ユーザーフロー」を選び、ユーザーフローの一覧画面を表示します。初めは以下のように「ユーザーフローが見つかりません。」と表示されます。

上記の画面から「新しいユーザーフロー」を選び、以下の画面からユーザーフローの作成を開始していきます。

以下のように、ユーザーフロータイプに「サインアップとサインイン」、バージョンは「推奨」を選んでから「作成」を選択してください。なお、ここで「サインイン」を選ぶことで、ユーザー自身によるサインアップ（ユーザー登録）は許可しない運用とすることも可能です。

「作成」を選択すると、作成画面が表示されます。

「名前」はテナント内で一意になるように設定します。公式ドキュメントのチュートリアルと同じように「signupsignin1」でも構いません。最終的にリクエストパラメータの一部となるので、あまり変なものは設定しないほうが無難です。

「IDプロバイダー」は「Email signup」を選択します。ユーザー登録（Signup）時に、メールアドレス宛に認証コード（Verification Code）を送る方法で本人確認を行う方式です。初期状態の場合、提供されている手段はこの1種類のみですが、事前にFacebookやGoogleなどのIDプロバイダーを追加していれば、それらの選択肢も表示され、ユーザー登録やユーザー認証に使用できるようになります。

次に、今回のメインテーマである多要素認証（MFA）の設定を行います。

今回の記事では、追加デバイスを必要としない「メール」を選択して進めます。

ここで利用可能な手段は前回の記事にも書いたとおり「メール」「SMS」「通話」「Authenticatorアプリ」の4種類なのですが、選択肢としては「SMSまたは電話」も含めた5種類となります。それぞれの方法の特徴についてもう一度確認しておきましょう。

なお、「SMS」「通話」「SMSまたは電話」を選んだ場合、ユーザー登録時など初回アクセス時に電話番号の登録/確認を行う手順が追加されます。また、「Authenticatorアプリ」を選んだ場合は、QRコードを読み込む手順が追加されます。

「MFAの強制」については、今回は「常にオン」を選びます。「条件」を選択した場合、次の「条件付きアクセス」と組み合わせて、特定のデバイスや場所（IPアドレス範囲）に対するMFAの有効/無効を設定できるようになります。例えば、PCの場合のみMFAを有効にすることや、社内のIPアドレスからのアクセスのみMFAを無効にすることが可能になります。

続きの項目を設定していきましょう。

「条件付きアクセス」はOffのままにします。なお、条件付きアクセスを有効化したい場合は、この項目をOnにしたうえで、B2Cテナント管理画面のメニューから「条件付きアクセス」という項目を選んで、具体的な条件をポリシーとして設定する必要があります。条件付きアクセスの設定では、追加のMFAを要求する以外に、条件に該当するアクセスをブロックすることも可能です。

最後に、「ユーザー属性とトークン要求」という設定がありますが、ここは初期値のままで構いません。この項目では、ユーザーの属性情報について、ユーザー登録時に収集する属性やユーザー認証成功時にアプリに渡す属性を設定します。テナント管理画面からカスタム属性を追加済みであれば、カスタム属性も設定することができます。

設定項目を入力したら「作成」を選択し、ユーザーフローの作成を完了します。

これまでの設定で、Azure AD B2CのMFA機能を動かす最低限の環境が整いました！

４. ユーザーフローの編集（日本語化）

早速、作成したユーザーフローを実行してみたいところですが、ここで画面表示を英語から日本語に変更してみましょう。

ユーザーフロー一覧の画面から、先ほど作成したユーザーフローを選択すると、下記のようなユーザーフローの概要ページが表示されます。

先ほど設定した項目以外にも、ユーザーフローに関する細かい設定がいくつか存在します。

言語を英語から日本語に変更するためには、左側のメニューから「言語」を選んでください。

初期状態では変更操作が無効化されているので、一旦「言語のカスタマイズを有効化」を選んで変更可能な状態にした後で、一覧から「日本語」を選び、以下の編集画面を表示してください。

こちらの画面で「有効」と「既定」を「はい」にして保存するとデフォルトの言語が日本語になります。この設定により、Webの画面だけでなく、確認コードが送られるメールの文章や、MFAの方法として「通話」を選んだ場合の音声も日本語に変更されます。

5. ユーザーフローの実行

変更したら、いよいよユーザーフローを実行していきます。ダイアログを閉じて、ユーザーフロー画面上部の「ユーザーフローを実行します」を選んでください。

画面右側に「ユーザーフローを実行します」ダイアログが表示されます。

アプリケーションや応答URL（リダイレクトURI）を指定してユーザーフローを実行する画面が表示されます。今回はアプリもリダイレクトURIも1種類しか設定していませんが、複数設定されていれば選択して実行することができます。

「ユーザーフローエンドポイントを実行」の欄は、実際にユーザーフローを呼び出すときのURLで、今回の設定だと以下のような形式になっています。

https://[テナント名].b2clogin.com/[テナント名].onmicrosoft.com/oauth2/v2.0/authorize
?p=B2C_1_[ユーザーフロー名]&client_id=[アプリケーションID]&nonce=defaultNonce
&redirect_uri=https%3A%2F%2Fjwt.ms&scope=openid&response_type=id_token&prompt=login

これまで設定してきたテナント、アプリケーション、ユーザーフローの情報や、リダイレクトURIとしてjwt.msが指定されていることがわかると思います。

「ユーザーフローを実行します」を選ぶと、上記のURLで新しいタブ（またはウィンドウ）が開きます。

ログイン画面が表示されます。まずは「今すぐサインアップ」を選んでユーザーを登録しましょう。

こちらがサインアップ画面です。メールアドレスを入力して、「確認コードを送信」とすると、メールが送信され、確認コード入力画面に変化します。

メールに送信された確認コードと、パスワードを入力して「作成」を選ぶと、次のような画面に変化します。

ここでもう一度確認コードの送信を求められてしまいました。

なにやら違和感のある流れですが、実はこの時点でユーザーの登録（サインアップ）は完了済みで、ユーザー認証（サインイン）の手続きに進んでいます。つまり、こちらはユーザーフローでMFAの方法として「メール」を設定したために表示されたMFAの画面となっています。

再度確認コードを送信・確認して「続行」を選ぶと、最終目標であるhttps://jwt.msの画面が表示されます。

というわけで無事、Azure AD B2CでMFAを動かすことができました。

実際のWebアプリとの接続ではさらに、「クライアントシークレット」の作成や、連携先となるアプリ側での設定やアクセストークンの検証など、セキュリティ上重要なポイントがいくつかあるのですが、今回はひとまず、デモサイト（https://jwt.ms/）を連携先アプリとして動作させるまでの手順をご紹介してまいりました。

最後までお読みいただきありがとうございました。Azure AD B2Cの構築や、連携するアプリケーションの開発についてご相談がございましたら、NTTテクノクロスまでお気軽にご連絡ください！