分享方式:


案例:呼叫 Web API 的原生應用程式

了解如何建置 AD FS 2019 所驗證的原生應用程式登入使用者,以及使用 MSAL 程式庫 取得權杖來呼叫 Web API。

閱讀本文之前,您應該先熟悉 AD FS 概念授權碼授與流程

概觀

概觀

在此流程中,您會將驗證新增至原生應用程式 (公用用戶端),因此可以登入使用者並呼叫 Web API。 若要從登入使用者的原生應用程式呼叫 Web API,您可以使用 MSAL 的 AcquireTokenInteractive 權杖取得方法。 若要啟用此互動,MSAL 會利用網頁瀏覽器。

若要進一步了解如何在 AD FS 中設定原生應用程式,以互動方式取得存取權杖,讓我們使用此處提供的範例,並逐步進行應用程式註冊和程式碼設定步驟。

必要條件

  • GitHub 用戶端工具
  • 已設定且正在執行的 AD FS 2019 或更新版本
  • Visual Studio 2013 或更新版本

AD FS 中的應用程式註冊

本節說明如何在 AD FS 中,將原生應用程式註冊為公用用戶端和將 Web API 註冊為信賴憑證者 (RP)

  1. AD FS 管理中,以滑鼠右鍵按一下 [應用程式群組],然後選取 [新增應用程式群組]

  2. 在 [應用程式群組精靈] 上,針對 [名稱] 輸入 NativeAppToWebApi,然後在 [用戶端伺服器應用程式] 下選取 [存取 Web API 的原生應用程式] 範本。 按一下 [下一步] 。

    [新增應用程式群組精靈] 的 [歡迎] 頁面螢幕快照,其中顯示已醒目提示存取 Web API 範本的原生應用程式。

  3. 複製 [用戶端識別碼] 值。 稍後會在應用程式的 App.config 檔案中,將其當作 ClientId 的值使用。 針對 [重新導向 URI] 輸入下列內容:https://ToDoListClient. 按一下新增。 按一下 [下一步] 。

    [新增應用程式群組精靈] 的 [原生應用程式] 頁面螢幕快照,其中顯示重新導向 U R I。

  4. 在 [設定 Web API] 畫面上,輸入 [識別碼:]https://localhost:44321/. 按一下新增。 按一下 [下一步] 。 稍後會在應用程式的 App.configWeb.config 檔案中使用此值。

    [新增應用程式群組精靈] 之 [設定 Web API] 頁面的螢幕快照,其中顯示正確的標識符。

  5. 在 [套用存取控制原則] 畫面上,選取 [允許所有人],然後按 [下一步]

    [新增應用程式群組精靈] 的 [選擇 存取控制 原則] 頁面的螢幕快照,其中已醒目提示 [允許所有人] 選項。

  6. 在 [設定應用程式權限] 畫面上,確定已選取 [openid],然後按 [下一步]

    [新增應用程式群組精靈] 的 [設定應用程式許可權] 頁面的螢幕快照,其中顯示已選取開啟的標識符。

  7. 在 [摘要] 畫面上,按 [下一步]

  8. 在 [完成] 畫面上,按一下 [關閉]

  9. 在 AD FS 管理中,按一下 [應用程式群組],然後選取 [NativeAppToWebApi] 應用程式群組。 按一下滑鼠右鍵並選取 [內容]

    [A D F S 管理] 對話框的螢幕快照,其中顯示反白顯示的 NativeAppToWebApi 群組,以及下拉式清單中的 [屬性] 選項。

  10. 在 [NativeAppToWebApi 屬性] 畫面上,選取 [Web API] 下的 [NativeAppToWebApi – Web API],然後按一下 [編輯...]

    [NativeAppToWebApi 屬性] 對話框的螢幕快照,其中顯示醒目提示的 NativeAppToWebApi - Web A P I 應用程式。

  11. 在 [NativeAppToWebApi – Web API 屬性] 畫面上,選取 [發行轉換規則] 索引標籤,然後按一下 [新增規則...]

    [NativeAppToWebApi - Web A P I 屬性] 對話框的螢幕快照,其中顯示 [發行轉換規則] 索引標籤。

  12. 在 [新增轉換宣告規則精靈] 上,從 [宣告規則範本:] 中選取 [轉換傳入宣告],然後按 [下一步]

    [新增轉換宣告規則精靈] 之 [選取規則範本] 頁面的螢幕快照,其中顯示已選取 [轉換傳入宣告] 選項。

  13. 在 [宣告規則名稱:] 欄位中輸入 NameID。 在 [傳入宣告類型:] 選取 [名稱]、在 [傳出宣告類型:] 選取 [名稱識別碼],以及在 [傳出名稱識別碼格式:] 選取 [一般名稱]。 按兩下 [ 完成]。

    [新增轉換宣告規則精靈] 的 [設定規則] 頁面螢幕快照,其中顯示上述設定。

  14. 在 [NativeAppToWebApi – Web API 屬性] 畫面上按一下 [確定],然後按一下 [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 的識別碼值。

      應用程式組態檔的螢幕快照,其中顯示已修改的值。

  4. 開啟 Web.config 檔案。 修改下列內容:

    • ida:Audience – 在上述 AD FS 中應用程式註冊區段中輸入來自 #4 的識別碼

    • ida: AdfsMetadataEndpoint - 輸入 https://[your AD FS hostname]/federationmetadata/2007-06/federationmetadata.xml

      Web 組態檔的螢幕快照,其中顯示已修改的值。

測試範例

本節顯示如何測試上面所設定的範例。

  1. 變更程式碼之後,請重新建置解決方案

  2. 在 Visual Studio 上,以滑鼠右鍵按一下解決方案,然後選取 [設定啟動專案...]

    當您以滑鼠右鍵按兩下方案,並醒目提示 [設定啟始專案] 選項時所顯示清單的螢幕快照。

  3. 在 [屬性] 頁面上,確定已針對每個專案將 [動作] 設定為 [開始]

    [方案屬性頁] 對話框的螢幕快照,其中顯示已選取 [多個啟動專案] 選項,並將所有項目的動作設定為 [開始]。

  4. 在 Visual Studio 頂端,按一下綠色箭號。

    Visual Studio UI 的螢幕快照,其中已指出 [開始] 選項。

  5. 在原生應用程式的 [主要] 畫面上,按一下 [登入]

    [待辦事項 列表用戶端] 對話框的螢幕快照。

如果您沒有看到原生應用程式畫面,請從系統上專案存放庫儲存所在的資料夾搜尋和移除 *msalcache.bin 檔案。

  1. 系統會將您重新導向至 AD FS 登入頁面。 繼續並登入。

    [登入] 頁面的螢幕快照。

  2. 登入之後,在 [建立待辦事項] 中輸入文字 [在 Web Api 中建置原生應用程式]。 按一下 [新增項目]。 這會呼叫待辦事項服務 (Web API),並在快取中新增項目。

    [待辦事項 列表用戶端] 對話框的螢幕快照,其中新增了要填入 [待辦事項 專案] 區段的專案。

後續步驟

AD FS OpenID Connect/OAuth 流程和應用程式案例