サンプル: グローバル検索を利用した Blazor WebAssembly

[アーティクル]
11/16/2023

このサンプルは、Blazor WebAssembly アプリケーションからグローバル探索サービスを使用する方法を示します。

このサンプルは https://github.com/microsoft/PowerApps-Samples/tree/master/dataverse/webapi/C#/BlazorCDS からダウンロードできます

このサンプルはチュートリアル: Microsoft Dataverse を使用して ASP.NET Core Blazor WebAssembly アプリを作成するの手順を変更したものです

こちらからオンラインで、このサンプルをご利用ください: https://blazorcds.mohsinonxrm.com/

このサンプルを実行する方法

サンプルリポジトリをダウンロードまたは複製して、ローカルコピーを用意します。
セットアップの手順に従って、Microsoft Entra ID アプリ登録を作成し、サンプルを実行します。

このサンプルの概要

このサンプルは、アクセスできる環境をユーザーが切り替えるために、Web アプリケーションで選択 (ドロップダウン) コントロールを提供する方法を示します。

このサンプルの動作方法

Pages/EnvironmentChooser.razor ファイルはユーザーインターフェイスを提供し、ユーザーがログイン後に資格情報に基づいて使用可能な環境から選択できるようにします。

このページは、グローバル探索サービスにアクセスするように構成した、Program.cs 内の HttpClient (GDSClient) の名前付き定義に依存します。ユーザーがログインすると、使用可能なスコープにグローバル探索サービスへのアクセスが追加されます。ユーザーが別の環境を選択すると Models/AppState.cs の SelectedEnvUrl が変更されます。

アカウントレコードへのアクセスは、選択した環境に応じたアクセストークンを使用して Pages/FetchAccounts.razor が提供します。

設定

このサンプルを実行するには、まずテナントで Microsoft Entra ID アプリケーションを構成し、BlazorCDS\wwwroot\appsettings.json ファイルを更新してプレースホルダーの ClientId 値をアプリケーション (クライアント) ID に置き換える必要があります。以下の手順を使用してください:

アプリ登録の作成

Azure に移動します。
Microsoft Entra ID を選択します。
アプリの登録 に移動します。
新規登録 を選択します。

次のように入力します。

フィールド	値
名前	ユーザーの選択。 `BlazorGlobalDiscoverySample` を使用できます
対応しているアカウントの種類:	この組織ディレクトリが含むアカウントのみ (単一テナント)
リダイレクト URI (オプション)	`https://localhost:44363/authentication/login-callback`

登録をクリックします。
アプリケーション (クライアント) ID の値をコピーします。プロジェクトを更新する際に、これが必要です。

認証の構成

認証に移動します。
黙的な許可とハイブリッドフロー 配下で、次のオプションを両方とも選択します:
- アクセストークン (暗黙的なフローに使用)
- ID トークン (暗黙的なフローおよびハイブリッドフローに使用)
保存をクリックします。

アクセス許可の構成

API アクセス許可 に移動します。
アクセス許可の追加 をクリックします。
API アクセス許可の要求 ポップアップの Microsoft API タブで Dynamics CRM を選択します。
アクセス許可の選択 配下で user_impersonation を選択します。
アクセス許可の追加 をクリックします。
構成済みのアクセス許可 配下で、{自分のテナント名} に対して 管理者の同意を付与する をクリックします。
管理者の同意を付与する 確認ダイアログではいをクリックします。

プロジェクトを更新する

BlazorCDS Visual Studio ソリューションファイル (BlazorCDS.sln) を Visual Studio で開きます。
ソリューションエクスプローラーで wwwroot を展開し、appsettings.json ファイルを開きます。
プレースホルダー ClientId 値 (11111111-1111-1111-1111-111111111111) を、アプリ登録の作成でコピーしたアプリケーション (クライアント) ID 値に置き換えます。

サンプルの実行

Visual Studio で IIS Express をクリックし、サンプルを実行します。

実際の動作

アプリから開いたブラウザウィンドウで ログイン をクリックします:
資格情報を入力すると、ラベル 環境の選択 が付いた選択コントロールが表示されます。この選択コントロールは、提供した資格情報でアクセスできるすべての環境の一覧を表示します。
アカウントを取得する をクリックします。この操作により、選択した環境で表示できるアカウントレコードのリストが表示されます。
選択できる環境が複数ある場合は、別の環境を選択してアカウントレコードのリストを更新し、その環境で使用可能なレコードを表示させます。

クリーンアップ

このサンプルは環境が含むデータを変更しません。

次の方法で共有