共用方式為

如何：在您的 ASP.NET Web 應用程式中裝載登入頁面

  • 發行項

更新日期：2015 年 6 月 19 日

適用對象：Azure

套用至

  • Microsoft® Azure™ 存取控制服務 (ACS)

  • ASP.NET

概觀

此主題說明如何在您的 ASP.NET 應用程式中主控登入頁面。 此方法允許您完全自訂您的登入頁面，包括其配置、外觀及感覺。 從自訂登入頁面到 ACS 的通訊是透過 ACS 公開的 JSON 摘要來執行。

若要啟用同盟登入頁面外觀、行為和位置的完整控制權，ACS 會提供 JSON 編碼的中繼資料摘要，以提供名稱、登入 URL、影像和電子郵件功能變數名稱， (AD FS 僅為您的識別提供者) 。 此摘要稱為「主領域探索中繼資料摘要」。 ACS 提供自訂登入頁面的範例，其中包含與主領域探索中繼資料摘要通訊所需的程式碼。 您可以下載並完全自訂此頁面。

目錄

  • 目標

  • 概觀

  • 步驟摘要

  • 步驟 1 – 下載自訂登入頁面範例

  • 步驟 2 – 自訂您的自訂登入頁面外觀與感覺

  • 步驟 3 – 在 ASP.NET Web 應用程式中整合自訂登入頁面

目標

  • 熟悉 ACS 管理入口網站中的登入頁面。

  • 請確定每個目標都以特定工作的方式表示

  • 在 ASP.NET Web 應用程式中主控登入頁面以提供一致的外觀與感覺。

步驟摘要

  • 步驟 1 – 下載自訂登入頁面範例

  • 步驟 2 – 自訂您的自訂登入頁面外觀與感覺

  • 步驟 3 – 在 ASP.NET Web 應用程式中整合自訂登入頁面

步驟 1 – 下載自訂登入頁面範例

此步驟顯示如何下載自訂登入頁面範例。 您將使用此自訂登入頁面範例根據您的需求自訂，然後在您的 ASP.NET 應用程式中主控它。

若要下載自訂登入頁面範例

  2. 若未使用 Windows Live® ID 執行驗證，您必須這麼做。

  3. 使用 Windows Live ID (Microsoft 帳戶) 進行驗證之後，系統會將您重新導向至Azure 入口網站上的 [我的專案] 頁面。

  4. 在 [我的專案] 頁面上按一下所要的專案名稱。

  5. 在專案的詳細資料頁面上，找到想要的命名空間，然後按一下 [管理] 欄位中的 [存取控制] 連結。

  6. 在 [存取控制設定] 頁面上，按一下 [管理存取控制]。

  7. 向下捲到 [開發] 區段，然後按一下 [應用程式整合] 連結。

  8. 在 [登入頁面] 區段中，按一下 [登入頁面] 連結。

  9. 在 [登入頁面整合] 頁面上，在 [信賴憑證者應用程式] 欄位中，按一下想要的信賴憑證者應用程式。

  10. 在 [登入頁面整合： << 您的回復者 >> ]頁面上，找出選項 2：將登入頁面裝載為應用程式區段的一部分，然後按一下 [下載範例登入頁面] 按鈕。 將頁面儲存到任意位置。 這就是您要用於自訂的頁面。 頁面的名稱通常是<< YourRealm >>LoginPageCode.html。

步驟 2 – 自訂您的自訂登入頁面外觀與感覺

在此步驟中，您將自訂您在上一頁下載的自訂登入頁面範例。

  1. 請隨意選擇任何 HTML 編輯器 - 可以是簡單的 [記事本] 或強大的 Visual Studio® 2010 HTML Editor。

  2. 依您想要的方式設計自訂登入頁面的外觀與感覺。

步驟 3 – 在 ASP.NET Web 應用程式中整合自訂登入頁面

在此步驟中，您會整合您剛剛設計的自訂登入頁面與您的 ASP.NET Web 應用程式。

  1. 將您剛剛設計的自訂登入頁面複製到 ASP.NET Web 應用程式中的共用位置 - 通常是根資料夾。

  2. 公開公用頁面上自訂登入頁面的 URL，通常是 Default.aspx。 未經驗證的使用者將會按一下該使用者進行驗證。