🦜

外部テナントで顧客ユーザー管理― サインアップ時に属性を登録させよう

に公開

はじめに

この記事シリーズでは、外部テナントのEntra External IDを使用した、業務アプリを利用する顧客ユーザーのMFA認証やEntraIDからの情報取得や操作に関する実装について書いていきます。

前記事でユーザー自身のサインアップ機能(とMFA認証)をアプリに組み込みましたが、サインアップ時はメールアドレスとパスワードを登録するだけのシンプルなものでした。今回は、このサインアップの機能を拡張し、EntraIDに既定で備わっている属性や、任意の属性をユーザーの属性として登録させるようにしたいと思います。

実装概要

前記事で作成した[ユーザーフロー]を編集します。
そのほかに違いはないので、ユーザーフロー以外のEntraID環境や検証用のアプリはそのまま使いまわしたいと思います。

  • 前提:前記事の手順で、外部テナントのEntraID環境や検証用アプリが作成されていること
  1. 【EntraID】カスタム属性の定義
  2. 【EntraID】ユーザーフローの編集
    • フローへのユーザー属性追加
    • ページレイアウト設定

【EntraID】カスタム属性の定義

EntraID上で管理できるユーザーの属性には2種類あります。
一つは、EntraIDに既定で備わっているユーザーオブジェクトのプロパティ。もう一つは、企業独自の情報や表示制御のための情報など、任意の属性を定義したもので「カスタム属性」と呼ばれます。カスタム属性が定義できることで、ユーザーデータがEntraID上で一元管理できるというのは、嬉しいことではあります。(課題もあります・・・が後ほど。)

さて、追加していきましょう。
左メニューからEntra IDの「External Identities」を選択し、「カスタムのユーザー属性」→ 「追加」を選択

追加する属性の情報を入力します。

[名前] 任意の名前

属性の表示名であり、プロパティ名にもなります。(※プロパティ名はスペース除去される)
英数字スペースのみ、大文字小文字も厳格に区別されます。

[データ型] 用途に合うデータ型

文字列、boolean、intが選べます。選択によって、入力時のコンポーネントが変わります。

  • 文字列:テキスト、複数選択、単一選択
    ※選択系は選択肢の項目名がそのまま値になる
  • boolean:チェックボックス(「はい」ならチェックを、みたいなイメージです)
  • int:テキスト
[説明] 任意の説明

一覧上の説明欄に表示されたり、ユーザーフローの属性追加時のヘルプテキストとして表示されます。

このサンプルでは、ユーザーの所属組織のコード(別システムで採番されたもの)を格納するためのCompany Codeと、ユーザーが所属組織で管理者権限をもっているかどうかを格納するためのIs Adminをカスタム属性として定義してみました。

属性の種類がカスタムとなっているものが今の流れで追加したカスタム属性、ビルトインがEntraIDの既定の属性です。

【EntraID】ユーザーフローの編集

ユーザー属性追加

前記事で作成したユーザーフローを、サインアップ時にユーザー属性が登録できる形に書き換えていきます。

左メニューからEntra IDの「External Identities」を選択し、「ユーザーフロー」→ 一覧から前記事で作成したユーザーフローを選択

「ユーザー属性」を選択

ここに表示される属性が、サインアップ時にユーザーに登録できる属性の一覧です。
EntraID既定の属性(の一部)と、先ほど追加したカスタム属性も選択可能です。サインアップ時にメールアドレスは必須なため、デフォルトでEmail Addressにはチェックがついており、外すこともできません。それ以外の属性については追加、またあとから外すことも可能です。

今回は、Display NameCountry/RegionState/ProvinceCompany CodeIs Adminを選択し、「保存」を押します。

ページレイアウト設定

サインアップ時に表示される属性のラベルや並び順、入力形式、必須設定などを行います。

ユーザーフローメニューから「ページレイアウト」を選択します。
初期状態はこのような感じ。

ひととおりラベルを設定、「表示名」「所属組織コード」「お住まいの国」は必須とし、並び順も調整してみました。

「所属組織コード」はCheckboxMultiSelect(複数選択)、「お住まいの国」はRadioSingleSelect(単一選択)としてみました。

やることは以上です。

動作確認

属性登録付きサインアップ

前記事同様、アプリを起動してみます。
ログイン画面から、サインアップのリンクへ進んでください。ユーザーフロー以外変えていないので、メールアドレスを入力→ワンタイムパスワード検証までは、前記事と同じです。

違いが出るのはここ。前記事ではパスワード設定の項目しかありませんでしたが、ユーザーフローに紐づけた属性の入力項目が一緒に出るようになりました。

ほら、設定したとおりにラベルが・・・出てないですね。
カスタム属性に関してはきちんと設定されていますが、既定項目についてのラベル設定はガン無視されたようです。並び順や、選択肢は設定どおりになっています。

このまま、「次へ」を押すと、必須設定した項目にチェックが入ります。

入力して次へ進みます。

EntraID上のユーザー

問題なく作成できたようなので、EntraID上のユーザーを見てみます。
いますね。表示名が「YuFuru513」となっているのが今回作成したユーザーです。

ユーザーのプロパティをのぞいてみます。
「表示名」「都道府県」「国または地域」に、登録時に入力した内容が格納されているのが分かります。

さて、ここでカスタム属性の大きな課題が一つ。
カスタム属性は、EntraID上で確認できません。 GraphAPI、ないしはGraphExplorerを用いて確認することはできるのですが、パパパッと視覚的に確認できないというのは保守観点では少しためらうポイントではあります(個人的には。)

カスタム属性の確認

今回はGraphExplorerで確認します。

その前に、カスタム属性に関してもう少し補足しておきます。
カスタム属性は、基本属性とは本質的に異なる存在のため扱いに注意が必要です。

  • カスタム属性の保存先はb2c-extensions-appというテナントがデフォルトで持つ特殊なアプリ
  • カスタム属性を定義しても、誰もそのプロパティを登録していなければプロパティの存在が認識されない
  • カスタム属性のプロパティ名は一般的にextension_{appId-without-hyphens}_{custom-attribute-name}と説明される
  • {appId-without-hyphens}:前述のb2c-extensions-appのクライアントIDであり、自身が作成したアプリのクライアントIDではない
  • {custom-attribute-name}:カスタム属性名。
     - ページレイアウトで「名前」として表示されている
    • 属性定義時名前とは、スペースが除かれるなど必ずしも一致しない
    • 大文字小文字は厳密に区別され、一文字でも異なれば別のプロパティ

何が言いたいかというと、とにかく目に見えない存在で、登録しているはずなのにどこにも見当たらないという事件が勃発します。多くの理由は、思っていたプロパティ名と違う・・・そんな凡ミス・・・だったりするのですが。

まずは、確実なプロパティ名を捕まえることから始めます。

左メニューからEntra IDの「エンタープライズアプリ」 を選択 > 「すべてのアプリケーション」> カスタム属性を使用している自身のアプリを選択します。

「シングルサインオン」>「②属性とクレーム」の「編集」を選択します。

「新しいクレームの追加」を選択します。

「要求の管理」画面の「ソース」>「ディレクトリスキーマ拡張」を選択し、「アプリケーションの選択」画面でb2c-extensions-appを選択します。(自身のアプリを選択しないように!)

すると、登録されているカスタム属性が表示されるので、各属性を選択し下部に表示されるextensioin_から始まるプロパティ名を控えておきます。

GraphExplorerに入ります。

GraphExplorerでカスタム属性を取得するには、明示的に取得プロパティ名を指定する必要があり、下記のようにします。

GET https://graph.microsoft.com/v1.0/users/<取得対象のユーザーのオブジェクトID※>?$select=<取得したいプロパティ名>,<取得したいプロパティ名>,・・・

※オブジェクトIDはユーザーのプロパティ画面または、GraphExplorerでユーザー一覧を表示することで確認できます。(ログインID(メールアドレス)ではありません)

このプロパティ名の部分に、先ほど控えておいたカスタム属性のプロパティ名を使用します。
(既定の属性のプロパティ名は、属性のページレイアウト画面で一覧上右端に出ていた「名前」列がそのまま使えます。「ラベル」列ではありません。)
表示名、メールアドレス、所属組織コード、管理者かどうか、の4項目を取得してみます。

たしかに、ちゃんと格納されていますね。
(そう、でもこんなことしないと値が確認できないのです・・・)

おわりに

今回は、ユーザー自身のサインアップ時に属性登録機能を加えてみました。また、既定の属性とカスタム属性との違いや、カスタム属性の取得方法について説明しました。
次の記事では、登録した属性をトークンに載せてアプリで取得する方法について説明します。

外部テナントで顧客ユーザー管理 シリーズ記事一覧

  1. Azure Entra External ID(知識編)
  2. 基本的なMFA認証を組み込んでみよう(C#)
  3. サインアップ時に属性を登録させよう(C#) ※この記事
  4. トークンに属性を追加してみよう(C#)
  5. 基本的なMFA認証を組み込んでみよう(Next.js編)
    【第2章】ユーザー情報操作編
  6. GraphAPIで顧客ユーザー情報を操作しよう(本人編(C#))
  7. GraphAPIで顧客ユーザー情報を操作しよう(他人編(C#))

Discussion