ASP.NET Atlas 為您期待已久的 AJAX 樣式的網站提供支援
本文基於 ASP.NET“Atlas”的預發布版本。文中包含的所有資訊均有可能變更。
本文將介紹以下內容:
• |
ASP.NET“Atlas”簡介 |
• |
Atlas 體繫結構 |
• |
用戶端和伺服器控制項 |
• |
Atlas 和 Web 服務 |
本文涉及以下技術:
• |
ASP.NET、Visual Studio 2005、Internet Explorer |
本頁內容
|
什麼是 Atlas? |
|
Atlas 體繫結構 |
|
用戶端指令碼核心庫 |
|
用戶端指令碼控制項和組件 |
|
伺服器控制項 |
|
Web 服務 |
|
小結 |
2005 年 9 月,ASP.NET 小組發布了代號為“Atlas”的 ASP.NET 中新功能的第一個社區技術預覽 (CTP)。Microsoft .NET Framework 2.0 的這一功能擴充使開發人員能夠同時利用瀏覽器和伺服器功能,更輕鬆地建立豐富的、互動式網站。
Atlas 支援的這種類型的豐富開發統稱為“AJAX”(非同步 JavaScript 和 XML),這是一個較新的縮寫詞,代表了對某些現有技術的組合。現代瀏覽器包括 XMLHttpRequest 對象,可以從 JavaScript 使用此對象回調伺服器。這使得頁面無需重新整理整頁,即可對使用者輸入做出反應,並執行帶外操作。雖然這一概念大體很簡單,但 AJAX 庫可以大大減輕編寫與伺服器通訊及處理由 Web 服務所返回的 XML 的用戶端 JavaScript 的繁重任務。
AJAX 嘗試解決的這個一般性問題出在 HTTP 協議本身。HTTP 是瀏覽器用來與 Web 服務器通訊以檢索頁面並從瀏覽器向伺服器回傳資料的標準。該協議是無狀態的,即需由伺服器上的代碼負責在頁面重新整理之間保持使用者輸入。一直以來,典型的使用者體驗是整個頁面被重新整理,以將狀態資訊回送到伺服器。然後在發回瀏覽器的 HTML 中恢複頁面上的使用者輸入。
ASP.NET 替您管理此過程,它傳送一個隱藏檢視狀態表單欄位。即使實際上僅頁面上的某部分得到更新,也將傳輸整個頁面的 HTML,並出現暫時空屏。在此重新整理過程中,直到瀏覽器接收並呈現新視圖之後,使用者才能與頁面互動。AJAX 通過使用 XMLHttpRequest 對象回調伺服器以調用 Web 服務而無需重新整理整個頁面,改善了此體驗。然後基於接收的 XML 直接在 JavaScript 中修改被更新的頁面部分。使用者可能甚至不會覺察到發生了頁面更新,並可以繼續讀取頁面或與頁面互動,同時,帶外工作在後台非同步進行。
什麼是 Atlas?
ASP.NET 的 Atlas 功能不僅是用於編寫以用戶端為中心的 Web 應用程式的另一個 AJAX 指令碼庫。Atlas 基於 .NET Framework 2.0 構造並為更好地利用用戶端 JavaScript 和 XMLHttpRequest 對象新增了支援功能。它包括能夠更輕鬆地豐富現有 ASP.NET 應用程式的基於伺服器的功能,以及 Atlas 控制項和服務所使用的用戶端指令碼庫。圖 1 中的體繫結構圖顯示,Atlas 體繫結構跨接用戶端和伺服器,並應被視為用於建立更豐富、響應更及時的跨瀏覽器 Web 應用程式的一組廣泛的開發技術。
圖 1 ASP.NET Atlas 體繫結構
Atlas 支援的場合不限於通過非同步 JavaScript 調用更新頁面地區。您還將獲得其他技術難以實現的更豐富的用戶端體驗。以一個圍繞電影資料構建的 Web 應用程式為例。該應用程式也許需要允許使用者搜尋特定演員。顯然,提供包括所有演員姓名的全面的下拉式清單以便從中選擇並不實際,因此應用程式很可能會將這一問題分解。可能會要求使用者選擇演員姓名的首字母。這樣對伺服器的請求可以提供一個稍稍易於管理的列表,但從使用者體驗角度來說,並不太好。應用程式可能向使用者呈現一個文字框,以便輸入演員的部分姓名。然後伺服器至少可以有一些資料用來縮小搜尋範圍。情況有所改善,但仍然有待改進。而使用 Atlas 之後,您可以提供一個文字框,在使用者鍵入時動態做出反應,以協助縮小搜尋範圍,而無需等待瀏覽器重新整理整個頁面。圖 2 顯示可以如何使用 Atlas 添加自動完成行為,在使用者鍵入時提供反饋。
圖 2 篩選組合框
Atlas CTP 可從以下地址下載:atlas.asp.net。安裝後,它將在 Microsoft Visual Web Developer 中添加附加的 C# 和 Visual Basic .NET 網站模板。在 Visual Web Developer 中建立新的網站項目(單擊“檔案”->“建立”->“網站”)時,您將看到一個類似圖 3 中所示的對話方塊。Atlas 網站包括 Microsoft.Web.Atlas.dll 和更新的 web.config 檔案,該檔案配置 Web 應用程式以使其能夠使用基於 Atlas 的 ASP.NET 功能。在目前的版本中,Microsoft.Web.Atlas.dll 被置於應用程式的 bin 目錄中,作為本地程式集可用於整個應用程式範圍內。
圖 3 建立 Atlas 網站
基於 Atlas 的應用程式可通過將檔案從開發電腦複製到裝有 ASP.NET 2.0 的伺服器而輕鬆部署,無需擔心單獨安裝 Atlas。安裝是在應用程式層級而不是在電腦層級進行。在推出後續 CTP 版本後,這些程式可以在安裝早期版本的 Atlas 的電腦上使用,即使功能已經得到發展和更改。與系統範圍的安裝相比,這為遷移到更新版本提供了更多靈活性。
返回頁首
Atlas 體繫結構
首先要注意的是圖 1 中所示的 Atlas 體繫結構跨越了用戶端和伺服器。雖然 ASP.NET 2.0 中添加了一些附加的用戶端功能,但程度不如 Atlas。在體繫結構圖右側,請注意 Atlas 伺服器功能是構建在 ASP.NET 2.0 之上並對其功能進行了擴充。Atlas 包括一組新的伺服器控制項以及新增功能,旨在從瀏覽器訪問基於伺服器的資料和服務。
在左側您將看到全面的用戶端指令碼庫,您可以在編寫以用戶端為中心的 JavaScript 的過程中,獨立於伺服器功能而使用該庫。Atlas 新功能大量使用基於用戶端這一特性來支援通過改進的用戶端-伺服器互動來開發更豐富的應用程式。
在圖 4 中您可以看到 Web 應用程式中的典型用戶端-伺服器互動。首先,通過瀏覽器請求頁面,然後使用者與其互動。當使用者的某些操作需要從伺服器擷取資料時,將發生完整的頁面重新整理,根據使用者輸入更新頁的部分。遺憾的是,此行為不允許使用者繼續與頁面互動。而使用者在使用 Web 應用程式時必須不斷暫停。
圖 4 典型用戶端-伺服器互動
圖 5 顯示使用 Atlas 的用戶端-伺服器互動不需要完整的頁面重新整理。而是首先初始檢索 HTML,隨後調用伺服器擷取 XML、JavaScript Object Notation (JSON)、或 HTML 程式碼段形式的更新資料,以增量方式更新頁面。後台非同步呼叫在調用 Web 服務或檢索頁面更改時,不會使使用者察覺必須暫停。這些非同步呼叫為後續伺服器回傳管理更新的檢視狀態資訊,以便必須進行完整的頁面重新整理時,可將準確的頁面狀態傳送到伺服器。
圖 5 Atlas 用戶端-伺服器互動返回目錄
返回頁首
用戶端指令碼核心庫
Atlas 用戶端指令碼庫被作為多個不同的片段提供到瀏覽器。指令碼核心包括底層,庫的其餘部分在底層的基礎上構建。底層是瀏覽器的相容層。Atlas 的一個關鍵功能就是它將運行在支援 AJAX 關鍵元素的流行瀏覽器上。在 CTP 版本中,此支援已包括 Mozilla Firefox、Apple Safari 和 Microsoft Internet Explorer。瀏覽器安全色層是一個抽象層,通過它您可以放心編寫指令碼。而無需斟酌各瀏覽器實現之間的差異細節。通過它,當瀏覽器發展及發布新的版本時,還可以輕鬆擴充 Atlas 支援。發出請求的此類瀏覽器自動確定使用哪些瀏覽器特定的相容層部分。更進階別的代碼已寫入抽象層中,因此您無需編寫代碼處理瀏覽器實現中的各種變化。
在相容層之上是核心類型系統。此類型系統允許進行物件導向方式的 JavaScript 開發。它使運用 JavaScript 的開發人員能夠建立命名空間並在其中添加類。它還類比對象繼承。它支援介面、委託和枚舉,從而可以在程式開發伺服器端代碼(使用物件導向的程式設計語言,如 C#)與編寫用戶端 JavaScript 代碼之間更輕鬆進行切換。
基底類別庫層構建在類型系統之上,加上該層,就構成了整個用戶端指令碼庫核心。此概念借自 .NET Framework,並提供了一些熟悉的類型。其中有一個 Event 對象,它在 JavaScript 中以自然方式支援事件的多播。還有一個 StringBuilder 對象。另外還支援對象序列化,其中包括對 JSON 和 XML 資料的支援。基底類別庫還包括 WebRequest 和 WebResponse 類,它們提供對瀏覽器的 XMLHttpRequest 對象的抽象,這一點類似於 .NET Framework 中的 System.Net 命名空間。圖 6 中所示代碼示範如何使用 Atlas 指令碼核心在 JavaScript 中建立兩個簡單類型。首先建立的是 Movie 類型,它提供電影標題和流派屬性,以及一個 toString 方法。然後通過 Drama 類型擴充 Movie 類型並重寫 toString 方法。
使用 Movie 和 Drama 類型的頁面 7 所示。它首先引用 .js 檔案,其中,類型在 Atlas ScriptManager 控制項內定義。然後在 Click 處理常式中,頁面建立了 Movie 類型和 Drama 類型的執行個體,並調用其 toString 方法。您可能會預期像在任何物件導向的程式設計語言中一樣看到繼承行為,但正在啟動並執行這段代碼恰好是動態 JavaScript。當前 Atlas 安裝的另一優點是包含了用戶端指令碼庫的調試版本,這使得調試和故障排除更加輕鬆。調試 JavaScript 始終是一件麻煩的事,這樣可能會輕鬆一些。
返回頁首
用戶端指令碼控制項和組件
在構成 Atlas 體繫結構用戶端指令碼核心的各層之上是組件模型和控制項層。指令碼庫的此部分基於其下的指令碼核心構造,但是單獨向用戶端轉譯。編寫指令碼時,您可以選擇不包括組件層而僅直接使用 JavaScript 類型系統和基底類別庫,但您沒有訪問 Atlas 提供的用戶端組件的許可權,且不能使用 xml 指令碼,它是一組新的聲明性元素,包括在發送至瀏覽器的頁面標記中。xml-script 元素包括在使用以下新類型值的指令碼標記中:
<script type="text/xml-script">
支援在標記中添加一組附加元素的關鍵是使用指令碼標記。瀏覽器可識別指令碼元素,但無法處理 text/xml-script 類型。而 Atlas 指令碼庫能夠處理包含在指令碼標記本身中的元素。標記由用戶端指令碼庫的組件層處理。xml 指令碼在用戶端進行分析,以建立組件和控制項的執行個體。它可以包含它所定義的組件和控制項的屬性設定,並可以聲明它們與頁面上其他 HTML 元素之間的綁定。xml 指令碼元素還可以聲明 Web 服務資源,然後在標記內其他各處將其作為資料來源進行引用。圖 8 中的樣本頁顯示如何使用 xml 指令碼以聲明方式確定當滑鼠指標懸停在年份上時,與年份關聯的片名將以彈出式元素的方式顯示。
圖 8 中的頁麵包含一個顯示年的 DIV 元素以及一個顯示片名的 SPAN 元素,但該元素被聲明為隱藏。在該 xml 指令碼中,一個 popupBehavior 與片名關聯,並由與年關聯的 hoverBehavior 調用。popupBehavior 的程式碼封裝括在 Atlas 指令碼庫的組件和控制項層中。與盯著通常包含在頁面中的 JavaScript 相比,檢查 xml 指令碼更為容易,特別是當您開始調整代碼以處理多個瀏覽器實現時。類似於圖 8 中的 xml 指令碼的聲明性文法可以由開發工具輕鬆產生和使用。通過使用 Atlas 伺服器控制項產生 xml 指令碼,在頁面執行時能夠產生更豐富的使用者體驗。在 Atlas 應用程式中使用的大多數 xml 指令碼絕對不會直接在 .aspx 檔案中存在,大多數的開發人員也不必手動對它進行編碼。
作為 Atlas CTP 組成部分的各種行為均以改善使用者體驗為宗旨。進度行為可以提供某一操作正在後台等待處理的資訊。單擊、懸停和彈出行為可以豐富使用者互動。使用 xml 指令碼,可以通過聲明方式輕鬆將行為附加到在頁面上的 HTML 元素。因為行為本身是以 JavaScript 實現的,所以有可能實現更加複雜的行為,但其在各頁面間的使用可以通過 xml 指令碼。
返回頁首
伺服器控制項
通過 Atlas CTP 中所包含的伺服器控制項,可以輕鬆避免頁面回傳過程中伴隨出現的暫停。當控制項在後台更新其呈現時,使用者可以繼續與頁面互動。為實現這一目的,兩個伺服器控制項協同工作。可以將其添加到現有頁面以大幅改善效果。ScriptManager 控制項修改用戶端回傳行為,而 UpdatePanel 控制項管理伺服器上的頁面生命週期,以此來實現這種改變。
所有使用 Atlas 功能的頁面必須包括 ScriptManager 控制項。它負責協調將哪個 JavaScript 發送到用戶端。伺服器控制項可以為用戶端提供 JavaScript,並利用 ScriptManager 控制項來處理該指令碼。ScriptManager 控制項將利用該控制項實現的新的 IScriptComponent 介面。ScriptManager 控制項還提供對與 xml 指令碼元素關聯的組件指令碼庫的支援。
將 ScriptManager 控制項的 EnablePartialRendering 屬性設定為 true 將導致來自用戶端的回傳出現以下新的行為:
<atlas:ScriptManager EnablePartialRendering="true" runat="server" />
回傳行為被修改,以便在不中斷使用者體驗的情況下允許發生請求。對於部分呈現的請求,需維護為在各請求之間保持控制項資訊所需的檢視狀態資訊。正在重新整理或修改的地區的 HTML 程式碼將通過 JavaScript 與瀏覽器文件物件模型 (DOM) 的互動而更新。頁面上應允許部分更新的地區將在 ASP.NET 頁面中通過 UpdatePanel 控制項來指定。
UpdatePanel 控制項向 ScriptManager 控制項指示在頁面上哪些地區應單獨更新。當瀏覽器中的操作導致產生該頁面地區的回傳時,將發送表單資料並且在伺服器上開始執行該頁面的生命週期。因為指令碼是在後台非同步啟動回傳,因此仍然向使用者顯示該頁面。在伺服器上,將從用戶端發送來的檢視狀態資料恢複控制項狀態。呈現階段發生時,ScriptManager 控制項將隔離 UpdatePanel 地區的呈現,因為該地區的呈現正在被回送到瀏覽器。系統還將收集頁面的檢視狀態資料,並作為響應的一部分伴隨 HTML 一起發送。然後瀏覽器中的指令碼將用新的 HTML 替代與 UpdatePanel 內容的先前呈現對應的 HTML。
UpdatePanel 控制項可以包含 Triggers 和 ContentTemplate 的元素:
<atlas:UpdatePanel ID="UpdatePanel1" runat="server"><Triggers>...</Triggers><ContentTemplate>...</ContentTemplate></atlas:UpdatePanel>
ContentTemplate 內的地區在 ScriptManager 控制項管理非同步回傳時重新整理。Triggers 元素可以包含 ControlEventTrigger 和 ControlValueTrigger 元素。使用 Triggers 元素,頁面開發人員可以指定應導致地區更新的特定更改。這允許 UpdatePanel 控制項之外的其他控制項無需直接包含在 UpdatePanel 控制項之內,即可導致更改。它還允許使用簡單的聲明來控制頁面和 UpdatePanel 控制項的行為,並指示何時檢索新資料。
在一個頁面上可放置多個 UpdatePanel 控制項,並通過不同的觸發器來導致它們單獨更新。UpdatePanel 控制項的內容可以控制在響應特定使用者輸入所必需的最低範圍內。使用 UpdatePanel 控制項,現有 ASP.NET 頁面無需大量更改,即可使使用者感到響應更及時。
返回頁首
Web 服務
Web 應用程式是圍繞服務導向架構構建的。支援互動式應用程式的核心是支援從瀏覽器訪問服務。Atlas 支援兩種不同類型的服務。ScriptManager 控制項將使用自動產生的代理供 Web 服務參考:
<atlas:ScriptManager EnablePartialRendering="true" runat="server"><Services><atlas:ServiceReference GenerateProxy="true"Path="~/nominees.aspx" Type="Custom"</Services></atlas:ScriptManager>
然後用戶端組件可以直接從指令碼調用 Web 服務。Web 服務被綁定到控制項以支援更豐富的行為。例如,可在 xml 指令碼中將 AutoCompleteBehavior 定義為使用 Web 服務檢索相關可能性(請參閱圖 9)。
行為被附加到頁面上某一元素並增強其行為。此行為在 .aspx 標記中建立之後,即被稱作“擴充器”。AutoCompleteBehavior 可以通過使用 AutoCompleteExtender 控制項與元素關聯。擴充器無需直接編寫 xml 指令碼,即可與伺服器上的控制項關聯。然後控制項行為將通過呈現適當的 xml 指令碼以擷取用戶端行為而得到擴充。調用 Web 服務時,調用以及返回結果通常均以 XML 格式傳遞。Atlas 還支援以 JSON 形式序列化來自 Web 服務的資料,這消除了 XML 中的某些內在的開銷。JSON 資料可以在瀏覽器中直接還原序列化成 JavaScript 對象。Atlas 支援將伺服器中由 .NET 管理的更為複雜的類型序列化成瀏覽器中典型的 JavaScript 對象。這簡化了從瀏覽器訪問 Web 服務的任務。
從瀏覽器使用 Web 服務的想法從作為應用程式一部分的自訂 Web 服務,延伸到了 ASP.NET 應用程式服務。Atlas 提供直接從 JavaScript 使用表單驗證服務的功能:
Sys.Services.AuthenticationService.login(username, password, completionFunction);
使用者不必重新導向到登入頁面,然後再返回原始頁面;於是可以在使用者提供登入憑據時動態修改 HTML。.aspx 頁面中可用的設定檔資料也可以通過 Web 服務調用擷取。它支援通過 JavaScript Object Storage Service和檢索儲存在伺服器上的設定檔資料。
應用程式可能使用的 Web 服務始終位於同一主機伺服器上。實際上,它們甚至不必在同一個域內。瀏覽器將阻止使用 XmlHttpRequest 調用到頁面所在的域之外的其他域。存在一些巧妙的方式來繞過此限制,即通過使用隱藏 IFrame 對象來啟動子請求,但仍然麻煩。Atlas 提供了 Web 服務橋接功能來支援此應用場合。用戶端可以啟動一個 Web 服務調用,而目標在另一個域。調用被發送至源起 Atlas 應用程式,然後後者代理使用者請求目標伺服器,再將結果序列化並返回用戶端。Atlas 還能夠使用 IFrame 技術直接與其他域通訊。
返回頁首
小結
Atlas 提供一組功能,可用於建立更豐富的 Web 應用程式。用戶端指令碼庫簡化了編寫 JavaScript 的任務,並提供構造代碼以使用物件導向的方法編寫 JavaScript。使用 Web 服務功能,可輕鬆訪問遠程和本地服務。複雜類型的序列化使從用戶端和伺服器利用豐富類型變得輕鬆。伺服器控制項利用用戶端指令碼庫並允許現有的和新的應用程式大大降低目前 Web 應用程式中常見的服務遇忙暫停發生。
現在,每隔 1 個月就會發布新的 CTP 版本,其中包括修複、更改和新增功能。Atlas 最終會在 Visual Studio 中將這些整合到下一版本的 .NET Framework(帶設計時支援)。最近,Microsoft 已宣布推出有限許可,允許使用者在實際網站上部署 Atlas,並開始在 Web 應用程式中利用 Atlas。有關詳細資料及下載最新 Atlas CTP,請訪問 atlas.asp.net。
Matt Gibbs 是 Microsoft 的 ASP.NET 小組開發經理。Matt Gibbs 與他人合著有多本有關 ASP、行動控制項和 ASP.NET. 的著作。他的連絡方式為:mattgi@microsoft.com。
本文摘自 2006 年 7 月發行的《MSDN Magazine》。
2006 Microsoft Corporation 著作權。著作權所有,並保留一切權利。使用規定。