ASP.NET2.0網站導覽功能之建立導航

  一、 簡介

　　任何由多個頁面組成的網站都需要某種導航使用者介面。一個導航使用者介面可能象一些該網站中的到另外一些頁面的靜態超級連結一樣得簡單，或者可能包含菜單或樹形控制項的使用。但是，在為該網站建立一個導航使用者介面之前，首先必須定義網站的邏輯結構。(這個邏輯結構常常被參照為一個網站地圖。)例如，一個象Amazon.com這樣的網站被組織成各個部分-其中包括產品欄如電子學書，電腦書，DVD等等。其中的每個還可能含有子部分。書目按類型劃分，象CD，小說，曆史書，浪漫書類，等等。典型地，這些邏輯結構形成一個分類層次。在下面的螢幕快照顯示出Amazon.com的網站地圖的縮減版本。

　　一旦定義了網站地圖，就可以建立網站的導航使用者介面。在Amazon.com網站，首頁面在頁面左邊列出到各個分部分的超級連結。進入到一特定部分之後，在左邊將顯示該部分的子部分資訊。然而，也可以使用另外的導航使用者介面：你可能有一個樹來顯示各個部分和子部分，或用一個菜單作頂級功能表項目來列舉如書籍，電子產品，DVD，等等；而每個功能表項目的子功能表又包含各個部分的子部分。

　　在ASP.NET 2.0以前，開發人員典型地自己解決他們的網站導覽功能.然而，ASP.NET 2.0使得定義一網站的結構並且使用普通導航使用者介面元素實現它輕鬆極了。在本文中，我們將分析一下ASP.NET 2.0的網站導覽特徵。

　　 二、 ASP.NET 1.x時代的網站導覽

　　ASP.NET 版本1.x確實沒有提供任何內建的網站導覽支援；因此，大多數開發人員實現他們自己的網站導覽功能。在建立他們自己的網站導覽功能時，開發人員面臨兩個挑戰：

　　1. 決定怎樣把網站的結構資訊序列化到一張網站地圖中

　　2. 實現導航使用者介面元素

　　為解決第一個問題，開發人員們需要決定如何建模該網站的結構。要把這些資訊放置到一個XML檔案呢？還是添加一資料庫表來儲存網站的各個部分及其連絡方式？對於支援使用者帳戶的網站，可能有只對屬於特別角色的使用者是可存取的部分。而且，支援多種語言的網站某種程度上都需要提供針對各個網站部分的翻譯。

　　在決定需要儲存什麼資訊來描述網站的結構以及這些資訊怎樣被序列化(資料庫?XML檔案?另外的東西?)以後，開發人員還要面對第二個挑戰-怎樣向使用者顯示這個網站的結構。一個常用的導航使用者介面元素是菜單；然而，ASP.NET 1.x中並沒有提供內建的菜單Web控制項-這意味著開發人員要自己花錢購買或自己構建。

　　讓我們總結一下，在ASP.NET版本1.x中實現網站導覽並不是多麼困難的任務；但是，這是必須要做的另外一個任務。而且，既然沒有網站導覽的內建支援，每個開發人員可能會找到他自己的獨特方法，這提高了開發新手學習曲線的陡峭程度-他們必須學習定製網站導覽邏輯。

　　 三、 ASP.NET 2.0中的網站導覽

　　在ASP.NET 2.0中實現網站導覽輕而易舉，這歸功於構建網站導覽特徵。內部地，ASP.NET提供了一組可程式化API-用它可以進行網站地圖查詢。ASP.NET不需要為指定網站地圖而提供特殊格式，儘管它確實提供了一種使用XML格式檔案的預設選擇。關於怎樣序列化網站地圖的細節是可以被定製的，因為ASP.NET 2.0的網站導覽特徵使用一種提供者模型。該提供者模型使開發人員能夠定製一個特定ASP.NET分系統的內部實現-只要它們保持向前引用的API是相同的。

　　簡言之，你可以使用ASP.NET 2.0的預設的基於XML的方法來指定你的網站的網站地圖，或僅加上一點編碼，你就能使用現有的定製方法，或其它一些方法。(本文將討論使用預設的技術(基於XML和網站地圖)；本系統的後一篇文章將分析怎樣定製網站導覽提供者。)

　　除了提供一種可定製的手段來指定網站結構外，隨同ASP.NET 2.0一起發行的還有一些導航Web控制項-它們使得顯示網站地圖就象拖放一個控制項到你的ASP.NET頁面一樣容易：

　　1. SiteMapPath-顯示一個breadcrumb，用於顯示終端使用者處於相對於網站結構的具體位置。例如，在訪問Amazon.com網站的Novels部分時，一個breadcrumb顯示可能是這個樣子：Home＞Books＞Novels。

　　2. TreeView-用一個可展開的樹顯示網站的結構。

　　3. Menu-使用一菜單顯示網站的結構。

　　4. 在顯示網站導覽時，TreeView控制項和Menu控制項都使用SiteMapDataSource控制項來讀取網站地圖的內容。

　　在底層實現上，這些控制項調用了ASP.NET 2.0的網站導覽API。既然該網站導覽部分是用提供者模型來實現的，那麼，該控制項在怎樣序列化網站地圖的內部實現原理是易於理解的。也就是說，不管你是否使用預設的網站地圖或滾動你自己定製的網站地圖邏輯，導航控制項都可以用於同你的網站地圖一道工作。(假定，如果你想使用一個定製的網站地圖，那麼你確實需要建立一個類-它提供所想要的方法和屬性以與網站地圖一起工作；更細緻的討論見下一篇文章)。

　　 四、 定義網站地圖

　　一張網站地圖由一系列相聯絡的SiteMapNode對象組成。這些SiteMapNode以一種層次方式(在本文的開始已說明)聯絡在一起。該層次包含單個根結點-它是該層中唯一的一個沒有父結點的結點。在該層上的每個結點代表網站的一個邏輯部分。每一部分都有一個標題，URL，描述等-它用SiteMapNodes類的屬性(Title，Url，Description等)建模。

　　這些SiteMapNode對象的層次正說明了網站地圖是怎樣在記憶體中描述的-當通過ASP.NET 2.0的網站導覽API對它進行分析時。然而，這個網站地圖必須被以某種方式進行物理地序列化-如通過一個XML檔案或通過一個資料庫表。預設地，ASP.NET 2.0使用一個XML格式的檔案以提供一個預設的實現來序列化該網站地圖。為使用這種技術，你需要在你的web應用程式的根目錄Web.sitemap下建立一個XML檔案-它具有下列結構：

＜?xml version="1.0" encoding="utf-8" ?＞
＜siteMap xmlns="http://schemas.microsoft.com/AspNet/SiteMap-File-1.0"＞
　＜siteMapNode attributes＞
　＜siteMapNode attributes＞
　＜siteMapNode attributes＞
　...
＜/siteMapNode＞
＜siteMapNode attributes /＞
　...
＜siteMapNode attributes /＞
＜/siteMapNode＞
＜/siteMap＞
　　提示：關於建立Web.sitemap檔案

　　利用Visual Studio 2005，你能容易地建立這個網站地圖檔-這是通過在方案總管的該網站上單擊滑鼠右鍵並選擇"Add New Item"，然後選擇該網站地圖表徵圖來實現的。請確保檔案名稱為Web.sitemap。建立的檔案有幾個＜siteMapNode＞XML元素-類似於上面的XML片斷。

　　＜siteMapNode＞元素可以有多個屬性，最常用的有：

　　1. title-指定這個節的標題。

　　2. url-指定某個部分的URL；是可選的，但是如果提供的話，網站地圖中的每一個URL必須是唯一的。

　　3. description-這部分的可選描述；用在產生的導航控制項的alt屬性中。

　　＜siteMapNode＞元素可以嵌套到任何深度；然而，網站地圖必須包含一根＜siteMapNode＞元素。也就是說，＜siteMap＞結點必須有且只有一個＜siteMapNode＞元素子結點。

　　下列的網站地圖檔顯示出簡單部分中所說Amazon.com樣本的網站結構(根據本文最後所提供的內容，你可以把這個檔案以及一個完整的能夠進行網站導覽的ASP.NET 2.0網站裝載到你的電腦上去)。

＜?xml version="1.0" encoding="utf-8" ?＞
＜siteMap xmlns="http://schemas.microsoft.com/AspNet/SiteMap-File-1.0" ＞
　＜siteMapNode url="~/default.aspx" title="Home"＞
　＜siteMapNode url="~/Books/default.aspx" title="Books"＞
　＜siteMapNode url="~/Books/Novels.aspx" title="Novels" /＞
　＜siteMapNode url="~/Books/History.aspx" title="History" /＞
　＜siteMapNode url="~/Books/Romance.aspx" title="Romance" /＞
＜/siteMapNode＞
＜siteMapNode url="~/Electronics/default.aspx" title="Electronics" /＞
＜siteMapNode url="~/DVDs/default.aspx" title="DVDs" /＞
＜siteMapNode url="~/Computers/default.aspx" title="Computers" /＞
＜/siteMapNode＞
＜/siteMap＞
　　 五、 使用導航Web控制項顯示網站地圖

　　現在，既然我們已經定義了一個網站地圖，下面我們將要通過一個ASP.NET頁面來顯示該網站地圖的資料。如前面所提的，共有三個內建的導航Web控制項-SiteMapPath，TreeView和Menu。使用這些控制是簡單的-只需把它們拖動到該ASP.NET頁面並且設定屬性以調整控制項的外觀以適合你的網站的外觀需要。

　　為此，我們將為該網站建立一個首頁面。正如在《A Sneak Peak at Master Pages in ASP.NET 2.0》中所討論的，首頁面一般提供一個容易的方法來定義整個網站範圍的模板。既然導航使用者介面元素普遍出現在一個網站的每個頁面上，那麼首頁面常常就是一個來放置校正Web控制項的理想位置。具體地說，我的首頁麵包含一個有下面三部分的表格：

　　1. 一個表頭-這裡顯示網站的標題（"歡迎來到我的網站！"）

　　2. 一個左邊部分-這裡是一個控制項TreeView-它負責列出網站地圖的完整內容。這允許參觀者快速跳轉到網站的特定部分。

　　3. 一個主部分-這一部分包含相對於每個頁面的唯一的內容-它們共同構成整個首頁面(注意，在這一部分中的ContentPlaceHolder控制項)。另外，在這一部分的頂部還包括了一個控制項SiteMapPath-它用於向使用者提供一個breadcrumb，來向他們指示其當前位於網站結構的具體位置。

　　為把SiteMapPath控制項添加到主部分上，我簡單地從工具箱拖放SiteMapPath控制項到首頁面上。當添加一個TreeView控制項(或菜單)時，首先你需要添加一SiteMapDataSource控制項到該頁面；然後，添加TreeView(或菜單)並且設定它的DataSourceID屬性為SiteMapDataSource控制項的ID(這可以使用TreeView控制項的靈敏標籤來實現)。SiteMapDataSource控制項實現通過網站導覽API查詢網站地圖並且把完整的網站地圖結構提供給TreeView(或菜單)控制項。

　　下列螢幕快照顯示當通過一個瀏覽器來訪問時的該網站。注意，左邊的TreeView控制項列出網站地圖的完整內容。點擊TreeView控制項中的任何一個結點將快速地把使用者引導到適當的部分。頂部的SiteMapPath控制項向使用者指示他們在該網站層次的位置（也即，Home＞Books＞Novels）。

　　 六、 結論

　　本文是探討ASP.NET 2.0的網站導覽功能系列文章的第一篇。在這一篇文章中，我們分析了網站導覽的基礎，它包含兩步：使用一個網站地圖來定義網站的結構和通過使用導航控制項來實現網站地圖。幸好，ASP.NET 2.0使得所有這些處理甚是簡單。

　　在我們分析了網站地圖基礎的同時，我們還探討了一些更進階的功能。例如，通過使用ASP.NET 2.0的角色特徵，你可以限制該網站的某些部分，這樣顯示在導航控制項中的部分就依賴於訪問使用者的角色和為該網站地圖檔中的這一部分所定義的角色。另外，該網站地圖還包括支援地方化和屬性-這樣可以很容易地實現讓你的網站中的每一頁的標題和描述輕易地支援每種語言。所有這些以及分析怎樣建立一個定製的網站導覽提供者，都是我們在後面的文章中所要討論的。