共用方式為


如何:在您的 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 應用程式中主控它。

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

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

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

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

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

  5. 在 [存取控制設定] 頁面上,按一下 [管理存取控制]

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

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

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

  9. 在 [登入頁面整合: << 您的回復者 >> ]頁面上,找出選項 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。 未經驗證的使用者將會按一下該使用者進行驗證。