シナリオ: Web API を呼び出すネイティブ アプリ

  • [アーティクル]

適用対象: Windows Server 2022、Windows Server 2019、AD FS 2019 以降

AD FS 2019 によって認証され、MSAL ライブラリを使用して Web API を呼び出すためのトークンを取得するネイティブ アプリ サインイン ユーザーを構築する方法について説明します。

この記事を読む前に、ADFS の概念と認証コードの付与フローについて理解しておく必要があります。

概要

Overview

このフローでは、ネイティブ アプリ (パブリック クライアント) に認証を追加します。これにより、ユーザーのサインインが可能になり、Web API が呼び出されます。 ユーザーをサインインするネイティブ アプリから Web API を呼び出すには、MSAL の AcquireTokenInteractive トークン取得メソッドを使用できます。 この対話を有効にするために、MSAL では Web ブラウザーが利用されます。

AD FS でネイティブ アプリを構成してアクセス トークンを対話形式で取得する方法を理解するには、ここで入手できるサンプルを使用して、アプリの登録とコード構成の手順を説明します。

前提条件

  • GitHub クライアント ツール
  • AD FS 2019 以降が構成および実行されている
  • Visual Studio 2013 以降

AD FS でのアプリの登録

このセクションでは、ネイティブ アプリをパブリック クライアントとして登録し、Web API を AD FS で証明書利用者 (RP) としてクライアントに登録する方法について説明します

  1. [AD FS の管理] で、[アプリケーション グループ] を右クリックし、[アプリケーション グループの追加] を選択します。

  2. アプリケーション グループ ウィザードで、[名前] に「NativeAppToWebApi」と入力し、[クライアント/サーバー アプリケーション] で [Web API にアクセスするネイティブ アプリケーション] テンプレートを選択します。 次へをクリックします。

    Screenshot of the Welcome page of the Add Application Group Wizard showing the Native application accessing a Web API template highlighted.

  3. [クライアント識別子] の値をコピーします。 これは、後でアプリケーションの App.config ファイル内の ClientId の値として使用されます。 [リダイレクト URI] に次を入力します: https://ToDoListClient. [追加] をクリックします。 [次へ]をクリックします。

    Screenshot of the Native application page of the Add Application Group Wizard showing the redirect U R I.

  4. [Web API の構成] 画面で、[識別子] に次のように入力します: https://localhost:44321/. [追加] をクリックします。 [次へ] をクリックします。 この値は、後でアプリケーションのファイル App.config および Web.config で使用されます。

    Screenshot of the Configure Web API page of the Add Application Group Wizard showing the correct identifier.

  5. [アクセス制御ポリシーの適用] 画面で、[すべてのユーザーを許可] を選択し、[次へ] をクリックします。

    Screenshot of the Choose Access Control Policy page of the Add Application Group Wizard showing the Permit everyone option highlighted.

  6. [アプリケーションのアクセス許可の構成] 画面で、openid が選択されていることを確認し、[次へ] をクリックします。

    Screenshot of the Configure Application Permissions page of the Add Application Group Wizard showing open I D selected.

  7. [概要] 画面で、[次へ] をクリックします。

  8. [完了] 画面で、[閉じる] をクリックします。

  9. [AD FS の管理] で、[アプリケーション グループ] をクリックし、[NativeAppToWebApi] アプリケーション グループを選択します。 右クリックし、[プロパティ] を選択します。

    Screenshot of the A D F S Management dialog box showing the NativeAppToWebApi group highlighted and the Properties option in the dropdown list.

  10. [NativeAppToWebApi] プロパティ画面で、[Web API] の下の [NativeAppToWebApi – Web API] を選択し、[編集] をクリックします。

    Screenshot of the NativeAppToWebApi Properties dialog box showing the NativeAppToWebApi - Web A P I application highlighted.

  11. [NativeAppToWebApi – Web API のプロパティ] 画面で、[発行変換規則] タブを選択し、[規則の追加] をクリックします。

    Screenshot of the NativeAppToWebApi - Web A P I Properties dialog box showing the Issuance Transform Rules tab.

  12. 変換要求規則の追加ウィザード上で、[要求規則テンプレート] ドロップダウンから [入力方向の要求を変換する] を選択し、[次へ] をクリックします。

    Screenshot of the Select Rule Template page of the Add Transform Claim Rule Wizard showing the Transform an Incoming Claim option selected.

  13. [要求規則名] フィールドに「NameID」と入力します。 [入力方向の要求の種類] には [名前] を、[出力方向の要求タイプ] には [名前 ID] を、[出力方向の名前 ID 形式:] には [共通名] を選択します。 [完了] をクリックします。

    Screenshot of the Configure Rule page of the Add Transform Claim Rule Wizard showing the configuration explained above.

  14. [NativeAppToWebApi – Web API のプロパティ] 画面で [OK] をクリックしてから、[NativeAppToWebApi のプロパティ] 画面をクリックします。

コード構成

このセクションでは、ユーザーをサインインし、Web API を呼び出すトークンを取得するネイティブ アプリを構成する方法について説明します

  1. こちらからサンプルをダウンロードする

  2. Visual Studio を使用してサンプルを開く

  3. App.config ファイルを開きます。 次の変更を行います。

    • ida:Authority - 「https://[your AD FS hostname]/adfs」と入力します

    • ida:ClientId - 上記の AD FS セクションの [アプリの登録] の #3 からの [クライアント識別子] 値を入力します。

    • ida:RedirectUri - 上記の AD FS セクションの [アプリの登録] の #3 からの [リダイレクト URI] 値を入力します。

    • todo:TodoListResourceId – 上記の AD FS セクションの [アプリの登録] の #4 からの [識別子] 値を入力します。

    • ida: todo:TodoListBaseAddress – 上記の AD FS セクションの [アプリの登録] の #4 からの [識別子] 値を入力します。

      Screenshot of the App config file showing the modified values.

  4. Web.config ファイルを開きます。 次の変更を行います。

    • ida:Audience – 上記の AD FS セクションの [アプリの登録] の #4 からの [識別子] 値を入力します。

    • ida: AdfsMetadataEndpoint - 「https://[your AD FS hostname]/federationmetadata/2007-06/federationmetadata.xml」と入力します

      Screenshot of the web config file showing the modified values.

サンプルをテストする

このセクションでは、上で構成したサンプルをテストする方法を示します。

  1. コードの変更が行われたら、ソリューションをリビルドします

  2. Visual Studio 上で、ソリューションを右クリックし、[スタートアップ プロジェクトの設定] を選択します…

    Screenshot of the list that appears when you right-click the solution with the Set Start Up Projects option highlighted.

  3. [プロパティ] ページで、各プロジェクトに対して [アクション] が [開始] に設定されていることを確認します

    Screenshot of the Solution Property Pages dialog box showing the Multiple startup project option selected and all of the projects' actions set to Start.

  4. Visual Studio の上部で、緑色の矢印をクリックします。

    Screenshot of the Visual Studio UI with the Start option called out.

  5. ネイティブ アプリのメイン画面で、[サインイン] をクリックします。

    Screenshot of the To Do List Client dialog box.

ネイティブ アプリ画面が表示されていない場合は、プロジェクト リポジトリが保存されているシステム上で *msalcache.bin ファイルを検索して削除します。

  1. AD FS サインイン ページにリダイレクトされます。 指示に従ってサインインしてください。

    Screenshot of the Sign In page.

  2. サインインしたら、[ToDo 項目の作成] にテキスト「Build Native App to Web Api」を入力します。 [項目の追加] をクリックします。 これにより、To Do List Service (Web API) が呼び出され、キャッシュに項目が追加されます。

    Screenshot of the To Do List Client dialog box with the new to do item populating the To Do Items section.

次のステップ

AD FS OpenID 接続/OAuth フローとアプリケーション シナリオ