第一章 网页程式设计概论

1第一章網頁程式設計概論在本書的第一章中，我們將介紹幾個關於網頁程式設計有關的專有名詞，例如：『HTML』、『JavaScript』、『XML』、『ASP.NET』等等。同時因為ASP.NET屬於.NETFramework的一環，故本章也會介紹.NETFramework的觀念，本章內容將有助於讀者快速建立網頁程式設計的整體概觀。2大綱1.1 WWW與HTML1.1.1 WWW1.1.2 Web2.01.1.3 WWW網站架構1.2 網頁相關技術1.2.1 客戶端技術1.2.2 伺服器端技術1.3.NETFramework與VisualStudio1.4ASP.NET與VWD1.5類別／物件1.6本章回顧31.1 WWW與HTML在Internet上有著各式各樣的服務及應用，例如：Email、FTP、WWW等等。其中影響最大的就是WWW。『WWW』是WorldWideWeb的縮寫，中文翻譯為全球資訊網。4WWW是由歐洲核子研究中心(CERN)所研發的一種搜尋結構，於1993年正式對外開放，它取代了傳統電腦與網路採用樹狀結構搜尋資訊的方式，重新定義了一種網狀的資料搜尋結構，如此一來，便免除了樹狀結構搜尋資料失敗時，必須返回原搜尋點再往下搜尋的缺點。

除此之外，WWW可以連結各種Internet的其他種類服務（例如HTTP、FTP協定），並由於我們可以在WWW之上，建立起圖文並茂的超文件(HyperText)及超媒體(HyperMedia)網頁，透過超鏈結（HyperLink）功能，建立起網頁與網頁溝通的橋樑，因此帶動了網路的流行，現在大家使用瀏覽器來瀏覽的網路服務就是建構在WWW的基礎之上。

近年來，以Google為首的各種廠商逐漸推出以瀏覽器為執行環境的Web軟體（例如WebMail），搭配雲端運算架構的流行與網路頻寬的加大，使得未來所有的桌面軟體都可能出現Web模式的類似軟體。因此，WWW對於資訊產業而言，它是不斷在成長與轉變的。1.1.1 WWW51.1.2 Web2.0全球資訊網歷經10年演變，其中包含了.com網站公司的崛起與泡沫化。現今，全球資訊網正進行著新型態的演化，在『聚沙成塔』的觀念下，符合Web2.0精神的網站逐漸成為次世代全球資訊網的主流，也提供了每個人參與網路的無限想像空間。『Web2.0』一詞在2004年首度出現，它代表著WWW上的新型態，其中包含了一些新型態的網站、內容及服務，也包含了一些新的技術。事實上，Web2.0在W3C（管理WWW標準的機構）並無明確的定義，但實際上已被大眾所接受。Web2.0最主要的精神是『參與、互動、分享』，例如現在流行的部落格(Blog)、影音分享網站YouTube、眾人聯合編輯的維基百科等等，都是Web2.0典型的範例。61.1.3 WWW網站架構在WWW上最常見的架構就是Client/Server架構，一個最簡單的Client/Server架構如圖1-1，瀏覽器(Browser)代表的是客戶端（Client），網頁伺服器(WebServer)代表的就是伺服器端（Server）。圖1-1網頁伺服器架構一（只負責傳送HTML網頁）71.1.3 WWW網站架構瀏覽器具有解讀HTML文件，並將之轉換為HTML網頁的能力；HTML是一種網頁設計語言，一份HTML文件其實就是一個網頁，換句話說，我們所看到的網頁就是HTML文件經由解讀後的結果。最簡單的網頁伺服器至少必須具備以下3種能力：可接收透過HTTP協定所傳來的網頁要求。能夠搜尋與讀取伺服器端所存放的HTML檔案。具有透過HTTP協定將網頁回傳給客戶端（瀏覽器）的能力。當網頁伺服器安置妥當後，一旦我們在瀏覽器網址列中輸入所要求的網址及網頁名稱，瀏覽器便建立連線並發出HTTP需求，請求遠端的網頁伺服器回傳網址所標示的HTML檔案。網頁伺服器接收到此需求後，便搜尋檔案系統，並將所要求的HTML檔案以HTTP方式回傳給瀏覽器，接著切斷此次連線。最後，瀏覽器依據所取得的HTML檔案內容加以解讀成為我們所看到的網頁，這就是使用者瀏覽網頁時，瀏覽器與網頁伺服器的工作流程。81.1.3 WWW網站架構除了提供HTML檔案傳輸的陽春網頁伺服器外，有些功能比較強大的伺服器，還可以執行PHP、ASP、ASP.NET、JSP、CGI等伺服器端的程式，其網頁伺服器結構則如圖1-2。圖1-2網頁伺服器架構二（先執行傳統ASP程式，再回傳HTML網頁）91.1.3 WWW網站架構通常要求我們在瀏覽網頁時必須輸入使用者代號與密碼的網站大多屬於這一類型的網頁伺服器，其原理與單純的網頁伺服器類似，同樣是透過HTTP協定來要求伺服器做某些事並回傳一個HTML格式的封包。只不過此時所要求的服務，可能不只是一個單純的HTML檔案，而是一個ASP、ASP.NET、PHP或JSP檔案，伺服器會先執行這個ASP、ASP.NET、PHP或JSP檔案內的程式碼或編譯後的程式碼例如程式碼中可能要求從資料庫中取得使用者代號與密碼等資料，所以此類網頁伺服器通常具有與資料庫連接的能力，無論如何，當這些程式碼執行完畢之後，必須產生一個HTML格式的資料，並交由網頁伺服器透過HTTP協定傳回這些HTML格式的資料，這是因為瀏覽器除了HTML格式的資料外，其他格式的資料一律無法解讀。在上述的範例中，我們可以瞭解2件事(1)瀏覽器可以解讀HTML格式的資料(2)有些程式碼必須由伺服器端執行。101.1.3 WWW網站架構事實上，並非任何形式的程式碼都無法被瀏覽器解讀或執行，為了減輕伺服器的負擔，專家們發展了一些可以由瀏覽器執行的程式，此類程式最著名的有JavaScript/JScript與VBScript等，不過，由於這些程式是交由客戶端瀏覽器來執行，為了保障每一個瀏覽者的電腦安全，因此這類程式必須取消部分功能（例如：不允許建立檔案），雖然如此，JavaScript/VBScript程式仍然造就了網頁多樣化的效果，尤其是JavaScript搭配新的AJAX技術可完成的網頁功能與效果更為豐富，不但降低了網站伺服器的負擔，也使得Web2.0型態的網站更容易製作。

除此之外，為了使得伺服器端能夠獲得客戶端的某些資料，因此瀏覽器也必須具有送出表單(form)資料的能力。我們將瀏覽器與網頁伺服器的功能整理如表1-1。111.1.3 WWW網站架構表1-1網頁架構軟體分析121.1.3 WWW網站架構聯合化資訊交換(syndication)聯合化資訊交換（syndication）是一種資訊傳播方法，透過feeds格式與REST架構（WWW採用的建構模型）進行傳送，它的優點是改善閱讀的時間與效率。

目前較普遍syndication規格有兩種，分別是2002年推出的RSS2.0與2003年／05年推出的Atom0.3／1.0，兩種格式都使用XML做為資料傳輸格式。Atom擁有比RSS更強大的支援功能和更嚴謹的定義，但由於推出時程較晚，目前syndication分享仍以RSS2.0為主。【Web2.0常用的技術】Web2.0常使用到的技術為syndication與AJAX兩種。使用這兩種技術建置的網站，且該網站符合Web2.0主要精神『參與、互動、分享』，則一般都將之視為Web2.0網站。131.1.3 WWW網站架構在各大新聞網站或部落格都可以見到使用RSS的應用。例如當您訂購了某個新聞網站的RSS之後，則它會自動下載新聞的標題，您若對該標題感興趣，則可以瀏覽該篇新聞，而不用瀏覽一些不感興趣的新聞，使得我們得以節省閱讀新聞的時間。AJAXAJAX(AsynchronousJavaScriptandXML)，全名是『非同步JavaScript和XML』，它是一種互動式的網頁開發技術。AJAX也可以看成是一種撰寫網路應用程式的新思維，它使得不用打斷使用者的操作（傳統上會因為等待伺服器回應而被打斷），就能動態地更新網頁內不同區塊的內容，而不需更新整個網頁。我們將於第18章深入介紹AJAX以及利用工具製作包含AJAX技術的網頁。141.2 網頁相關技術網頁技術可分客戶端與伺服器端技術，我們將在本節中分別加以簡介。151.2.1 客戶端技術客戶端代表的是瀏覽器，此處所指的客戶端技術代表可由瀏覽器解讀的格式或可由瀏覽器執行的程式。161.2.1 客戶端技術HTML標示語言HTML是一種標示語言（MarkupLanguage），也是一種標籤語言（TagLanguage）。HTML的標示碼以標籤來表示，利用標籤形容所包含的資料要顯示哪種格式或哪種效果（例如<a>標籤代表超鏈結效果、<b>標籤代表粗體格式）。而瀏覽器能夠解讀這些標籤所代表的意義，將之轉換為實際所看到的網頁效果。

瀏覽器可以直接解讀本地端的HTML網頁，也能夠解讀由網頁伺服器下載的HTML網頁，下面是HTML文件經由瀏覽器轉換成網頁型式的範例。【註】：若欲閱讀由伺服器端回傳給客戶端瀏覽器的HTML格式碼，可以利用【快顯功能表】的【檢視原始碼】指令來達成。17181.2.1 客戶端技術撰寫HTML網頁可使用純文字編輯器（例如：記事本），因為HTML文件本身是一個文字檔，但一般我們使用專業的網頁編輯器來編輯HTML（例如Dreamweaver），因為透過所見即所得的方式配置網頁內容比較快速也比較容易。單純的HTML文件，其副檔名為『.htm』或『.html』，而不是『.txt』，若設定為『.txt』，則瀏覽器會將之視為單純的純文字檔，而顯示標籤與內容。只有在設定為『.htm』或『.html』檔時，瀏覽器才會將之視為網頁檔，顯示內容與標籤效果而不會顯示標籤原文。191.2.1 客戶端技術XML與XHTMLXML(eXtensibleMarkupLanguage)中文翻譯為可延伸標記語言。1998年，W3C正式公佈XML的Recommendation1.0版語法標準，由表面上看來，XML是標記語言的一種，但是嚴格來講，XML最大的用途為定義其他語言的語法系統。這也正是XML功能強大，受到各方重視的緣故。透過結構和資訊導向，它為不同領域（產業界、學術界和研究單位）的文件，提供統一的描述語法，讓不同領域之間資訊交換的效率大大提升，並且能夠跨平臺進行資訊的整合與資源的共用。XML特別適用於電子商務應用，因為XML擁有自我定義的機制，使得資料在網路傳輸時能夠很容易地在傳送端與接收端做資料交換。此外，由於XML也可使用於資料描述，因此，您可以將它視為一種資料描述語言(metalanguage)。例如:用它來制定元件、記錄以及其他種類的資料結構（例如另一個語言）。201.2.1 客戶端技術XML也和HTML一樣屬於標示語言(MarkupLanguage)，但XML不同於HTML對於所有的標籤都定義了顯示格式的意義，對於XML而言，顯示格式並不是最重要的，相對地，資料所代表的意義才是最重要的，因此，XML並不負責標籤顯示的格式。因為XML與HTML是由兩種不同的設計目的所衍生發展的兩套語言。使用XML，您可以透過標籤來描述資料的結構，並且它還允許使用者視描述資料的需要，隨意地制定不同名稱的標籤，這和HTML有著極大的差別。

XML身為資料描述語言(metalanguage)，因此常用來制定各類文件格式。有些軟體使用XML取代原本使用ini檔來描述文件。例如新版Office、NETFramework的web.config檔都是以XML作為基礎設定的描述格式，其他軟體無法理解該XML檔案內容，但軟體本身可以理解該XML檔案內容。除此之外，XML也可以制定軟體間的資料傳送格式，只要雙方軟體能夠解讀標籤意義即可，例如製作webservice以及RSS。211.2.1 客戶端技術<configuration><system.web><membership><providers><addname="WebAdminMembershipProvider"type="System.Web.Administration.…………"/></providers></membership><httpModules><addname="WebAdminModule"type="System.Web.Administration.…………"/></httpModules><authenticationmode="Windows"/><authorization><denyusers="?"/></authorization><identityimpersonate="true"/></system.web></configuration>表1-2使用XML製作的web.config檔（.NETFramework軟體懂得各標籤意義）22表1-3使用XML製作的新聞RSS（只有Yahoo網站與RSS閱讀器懂得各標籤的意義）<?xmlversion="1.0"encoding="utf-8"?><rssversion="2.0"xmlns:atom="http:////Atom"xmlns:cf="http://.../rss/core/2005"xmlns:blogChannel="http://backend/blogChannelModule"><channelxmlns:cfi="http:///rss/core/2005/internal"cfi:lastdownloaderror="None"><titlecf:type="text">Yahoo!奇摩新聞-運動</title><link>http:////sports/</link><descriptioncf:type="text">Yahoo!奇摩新聞-運動</description><language>zh-tw</language><lastBuildDate>Wed,01Jun201114:55:01GMT</lastBuildDate><atom:updated>2011-06-01T14:55:01Z</atom:updated><ttl>20</ttl><image><url>/i/tw/news/v2/mh_small.gif</url><title>Yahoo!奇摩新聞-運動</title><link>http://</link><width>144</width><height>28</height></image><item><titlexmlns:cf="http://..."cf:type="text">NBA總決賽首場熱火8分之差(中廣)</title><link>http://2sk61.html</link>

</item><item></item><item></item></channel></rss>231.2.1 客戶端技術除了用來制定文件格式之外，XML甚至可以用來制定另一種語言，例如早期的HTML（HTML4.01版之前）都是採用SGML描述語言制定，而新版的XHTML則是以XML來制定。目前大多數的瀏覽器與網頁編輯軟體都能夠正確解讀XHTML標籤的意義，因為XHTML與HTML標籤的意義相同，只不過XHTML規定的更嚴格而已。

本書使用VisualWebDevelopers工具開發的網頁，實際回傳到瀏覽器的HTML標籤都是以XHTML為標準的。而ASP.NET的標籤則符合XML的規定。【註】簡而言之，XHTML就是新版的HTML，也是規定較嚴格的HTML。241.2.1 客戶端技術JavaAppletJava是一種物件導向程式語言，由Sun公司開發，執行Java程式是將Java程式先編譯為中間碼（即ByteCode）的類別檔，待執行時，再透過Java虛擬機器(JavaVirtualMachine；簡稱JavaVM或JVM)加以執行，由於Sun提供了各種平台的Java虛擬機器，因此，Java是一種跨平台的程式語言。

Java提供了Applet機制，程式設計者可以將程式設計並編譯為類別檔後獨立於HTML文件外，使用者可以從遠端下載到瀏覽器並在網頁中加以執行，唯一的前提是，瀏覽器必須先安裝Java虛擬機器(JVM)。當瀏覽器向Web伺服器要求一個包含JavaApplet的HTML網頁時，首先會將該HTML網頁下載到客戶端，解讀HTML後發現有<applet>標籤，代表要執行一個JavaApplet，接著依照標籤屬性的指示向伺服器要求下載JavaApplet的類別檔，下載完畢，最後由瀏覽器中的JVM在網頁中執行JavaApplet的類別檔，如下圖所示。251.2.1 客戶端技術圖1-3JavaApplet由客戶端瀏覽器執行261.2.1 客戶端技術【JavaApplet與ActiveX】早期JavaApplet與ActiveX都是在網頁中執行複雜程式的機制，其中JavaApplet為Sun發展的Java所支援，而ActiveX則是由微軟提出的對應機制。換句話說，兩者原處於競爭對手。初期，JavaApplet的普及領先ActiveX，因為各類瀏覽器都可以執行JavaApplet，而只有在IE瀏覽器中可同時支援兩種機制。

後來微軟自行修改了IE中的JVM，只支援以MicrosoftJ++（一種極類似於Java的程式語言）方式開發成的JavaApplet，而這種程式無法在非IE的瀏覽器上正確執行，並且IE的JVM也無法完全支援以Sun版本開發的JavaApplet。在此同時，IE瀏覽器的市佔率持續提高，使得大多數開發「網頁中程式」的程式設計師採用了ActiveX機制。此時，JavaApplet大多只用在網頁中顯示動畫的應用。

隨著Flash的流行與普及，JavaApplet連製作動畫的市場也逐漸失去，並且在WindowsXP之後，微軟又不主動提供JavaVM的下載。這使得JavaApplet幾乎完全退出市場。271.2.1 客戶端技術JavaScript/VBScript/JScriptScript有人將之翻譯為『腳本』，事實上，它與直譯程式的概念更為接近，Script其實指的是一份未經編譯的程式原始碼，只有在需要被執行時，才透過翻譯程式針對Script中的每一個指令進行解讀及執行。Script程式並未限制使用於客戶端或伺服器端，但一般我們若只講Script程式，通常指的是客戶端使用的JavaScript、VBScript或JScript。JavaScript看似與Java有關，但實際的功能則比Java精簡許多，我們應該將兩者視為不同的語言，JavaScript比Java簡單很多，使得一般非程式專精的網頁開發者也能夠透過JavaScript強化網頁的功能。281.2.1 客戶端技術VBScript與JScript都是由微軟發展，VBScript是由傳統VB語法精簡而來，而JScript則是微軟為了與Sun的Java抗衡所自行設計的Java-like語法，就現實面來說，幾乎所有的瀏覽器都支援JavaScript，而IE則支援JavaScript、VBScript及JScript。而這三種Script都可以內嵌在HTML文件中，也可以獨立存在，再透過特殊的HTML標籤引入。目前大多以JavaScript為主，尤其是AJAX流行後，JavaScript已經站穩客戶端程式的重要地位。【VB與VBScript】本書所提之VB與VBScript可能有三種，其中，VBScript是IE瀏覽器可直譯執行的程式語言。VB或傳統VB則指的是舊版VisualBasic6程式語言，VB.NET則指的是架構在.NetFramework的新版VB程式語言。【JavaScript為物件基礎語言】JavaScript雖然也可以使用物件的屬性與方法，但它不提供繼承機制，所以JavaScript只能算是物件基礎語言，而非物件導向語言。291.2.1 客戶端技術CSSCSS（CascadingStyleSheet）是一種樣式表，由W3C制定標準，目前的標準為CSS3，不過最新的IE8/9只支援部份的CSS3，因此大多數網站仍使用CSS2來設計樣式。CSS樣式表可以彌補HTML的不足，所謂『樣式表』其實是一堆網頁效果設定的集合，透過HTML的特殊標籤或屬性就可以引用這些事先定義好的設定值，享受相同設定重複使用的優點。在本書中，我們將會發現，ASP.NET大量使用CSS來設計網頁元件的顯示細節。例如按鈕或文字標籤的位置、以及文字的大小等等。301.2.1 客戶端技術AJAXAJAX也屬於客戶端的技術之一，但它並不是單一的技術，而是一系列相關技術的總稱，包含XHTML、CSS、JavaScript、XML、DOM、XMLHttpRequest等等，其主要程式皆由JavaScript開發，搭配某些特殊的元件來完成。其中大多數的技術已經在前面解釋過了，而DOM與XMLHttpRequest的解釋如下：DOM：DOM是一種文件模型，提供了以樹狀結構與節點的存取模式，使得JavaScript的程式碼更精簡，並更有效率地存取文件資料。例如存取XML檔案就可以透過XMLDOM來完成。XMLHttpRequest：XMLHttpRequest是一個物件，可用來與Web伺服器進行非同步數據交換。暫時我們對AJAX的解釋到此為止，其餘的介紹留待第18章時再進行詳盡的介紹，現在您只要先理解AJAX是一些客戶端技術的總稱即可。事實上，ASP.NET2.0並未包含AJAX，而是另外以ASPNETAJAX存在，直到ASP.NET3.5才將之納入。但AJAX嚴格來說，仍屬於客戶端技術。311.2.2 伺服器端技術伺服器端代表的是網頁伺服器(WebServer)，此處所指的伺服器技術代表由網頁伺服器執行的各類技術，但實際上不論您採用的是哪一種技術，其最後產生的結果都是HTML（可內嵌其他客戶端技術）格式的文件，然後將此文件回傳給瀏覽器，解讀為我們看到的網頁型式。CGICGI(CommonGatewayInterface)被翻譯為『共同閘道介面』，它是早期由伺服器端執行程式的一種策略。嚴格來說，CGI是一種介面，用來在HTTP伺服器與閘道程式之間進行溝通，因為每個傳送到伺服器的資料都會由一個閘道程式來處理，CGI就是負責這兩者之間的資料傳輸介面。

在使用CGI技術的伺服器網站中，CGI程式屬於一種外部程式，您可以使用熟悉的語言（例如C/C++）進行開發，而這個程式同樣必須先經過編譯為執行檔，存放在伺服器端以備執行。321.2.2 伺服器端技術以C/C++語言所開發的CGI程式為例，傳統C/C++程式的標準輸入裝置(stdin)為鍵盤，標準輸出裝置(stdout)為螢幕，而CGI程式由於是透過CGI介面傳輸資料，因此，標準輸出入裝置(stdin與stdout)則改為CGI介面，程式可以由CGI介面取得使用者透過表單(Form)傳送過來的資料，也可以透過CGI介面取得相關的環境變數(EnvironmentVariables)，同時也會將回傳的HTML文件寫入到CGI介面，然後由網頁伺服器回傳給瀏覽器。其架構如圖1-4所示。圖1-4CGI運作架構圖331.2.2 伺服器端技術

ASP/JSP/PHP/ASP.NET相對於CGI而言，ASP/JSP/PHP是中期比較流行的伺服器網頁程式技術。JSP(JavaServerPage)使用的是Java語法，並且能夠匯入(import)眾多Java的類別函式庫；而PHP則使用的是C或C++語法，並且提供大量存取MySQL資料庫的函式庫。至於ASP.NET則可以說是最新的伺服器網頁程式技術。

ASP(ActiveServerPage)是由微軟所發展，正如同前面所說的，廣義的Script並不侷限於客戶端或伺服器端，在ASP中，您可以選擇使用VBScript或JScript語法來撰寫程式，但大多以VBScript語法來撰寫ASP網頁程式。ASP最終的版本為3.0（本書稱之為傳統ASP），而新一代的ASP則改為ASP.NET，版本則由1.0,1.1,2.0,3.5，發展到現今的ASP.NET4.0版（也就是本書重點）。

ASP.NET能夠使用VB.NET、C#等由.NETFramework所提供的程式語法來開發。在副檔名方面，傳統ASP使用的是『.asp』，而ASP.NET使用的則是『.aspx』。

1.2.2 伺服器端技術在這裡還是要提醒讀者，無論您在伺服器端使用哪一種技術來撰寫程式，其結果都必須回傳給瀏覽器，而回傳給瀏覽器的內容則必定為HTML格式（當然也可以內附一些由客戶端執行的JavaScript/VBScript程式碼），因為瀏覽器只認得HTML標籤與屬性。例如下面的ASP範例(ch1_01.asp)將會回傳與1-7頁相同的HTML標籤與屬性。3435<%Response.write("<html>")Response.write("<head>")Response.write("<title>HTML網頁效果示範</title>")Response.write("</head>")Response.write("<bodybgcolor='PINK'style='BACKGROUND-COLOR:#FFFFCC'>")Response.write("<b><fontsize='5'color='#0000FF'>陳錦輝的著作</font></b>")Response.write("<ul>")Response.write("<li><b><fontcolor='#9966FF'size='4'>程式設計類</font></b></li>")Response.write("<ul>")Response.write("<li><fontcolor='#CC0066'>C語言初學指引</font></li>")Response.write("<li><fontcolor='#CC0066'>C/C++初學指引</font></li>")Response.write("<li><fontcolor='#CC0066'>Java初學指引</font></li>")Response.write("<li><fontcolor='#CC0066'>資料結構初學指引</font></li>")Response.write("</ul>")Response.write("<br/>")Response.write("<li><b><fontcolor='#9966FF'size='4'>網頁設計系列</font></b></li>")………………Response.write("</ul>")Response.write("</body>")Response.write("</html>")%>表1-4傳統ASP(ch1_01.asp)文件內容【回傳的資料同1-7頁】361.3 .NETFramework

與VisualStudioASP.NET屬於.NETFramework的一環，而.NETFramework則是一個程式開發與執行的環境架構，它能夠同時包含視窗程式與網頁程式的開發。長期以來，C++與Java佔據絕大多數的物件導向程式語言市場，Microsoft為了增加市場佔有率，在2002年提出了.NETFramework，目前的版本為4.0版或稱為2010版，其架構如下圖。圖1-5.NETFramework的視窗程式與網頁程式架構圖371.3 .NETFramework

與VisualStudio在圖1-5中，我們可以發現，對於一般Windows環境而言，執行的程式為視窗應用程式，而.NETFramework以WindowsForms（Form代表表單）提供此功能。至於網路作業環境，則透過網路傳輸，在伺服器端執行ASP.NET程式為主，它會產生一些格式回傳給客戶端，這些格式又分為包含HTML的WebForms以及不包含HTML的WebServices兩種。其中，瀏覽器可解讀HTML，因此通常在瀏覽器中要求讀取的.aspx網頁就是採用WebForms來開發。

至於如何產生WindowsForms、WebForms、WebServices等成果，則是透過.NETFramework的類別庫以及CLR來完成，實際與作業系統進行溝通的為CLR，它可以視為一種虛擬機器，提供各類.NETFramework程式的執行環境。

事實上，.NETFramework一共包含三個層次，第一層為WindowsForm與ASP.NET，第二層則為類別庫，最底層則為CLR，其中各層所包含的元件如下圖所示。381.3 .NETFramework

與VisualStudio圖1-6.NETFramework架構圖391.3 .NETFramework

與VisualStudio.NETFramework的元件配置如圖1-6，而.NETFramework的視窗應用程式(WindowsForms)又應該以何種程式語言的語法來撰寫呢？答案是沒有限制，因為.NETFramework採用兩段式翻譯方式（與Java類似），它會先將原始程式（各種語言的程式碼）編譯為微軟的中間碼MSIL(MicrosoftIntermediateLanguage)，這個中間碼與組合語言的格式類似，可將之視為.NET平台CLR上的組合語言，這些MSIL格式的程式碼以及一些中繼資料將被置於可攜式執行檔(portableexecutablefile；PE檔)中。當真的要執行時，再由執行環境以JIT(JustinTime)的方式將PE檔內的MSIL程式碼編譯成可執行的原生碼(nativecode)來執行。其過程如圖1-7所示，而後半段的編譯行為由ilasm.exe(MSILAssembler)來執行，微軟將此軟體稱之為組譯器(Assembler)，這是因為MSIL比較像是CLR上的組合語言。401.3 .NETFramework

與VisualStudio圖1-7a.NET程式的開發流程411.3 .NETFramework

與VisualStudio圖1-7b.NET程式的開發流程421.3 .NETFramework

與VisualStudio微軟在推出.NETFramework時，保證這是一個跨語言與跨平台的架構，因此，理論上.NETFramework的視窗應用程式可以使用各種語言來開發，同時能夠在各種平台上執行但實務上則大多以VB.NET與C#語法為最多，這是因為微軟提供的開發工具VisualStudio.NET僅提供將VisualBasic.NET（簡稱VB.NET）、VisualC#、VisualJ#、VisualC++.NET等幾種語言的緣故。換句話說，VisualStudio.NET僅提供某幾種程式語言轉換為MISL中間碼的功能（也就是VB.NET編譯器/vbc.exe與C#編譯器/csc.exe），而非各種程式語言的編譯器。圖1-8VisualStudio.NET架構圖431.3 .NETFramework

與VisualStudio在跨平台上的實作上，微軟提供的CLR也只能運行於Windows作業系統（包含XP、Server、Vista等），而不能運行於Unix-like與Mac-OS的作業系統。但有一個名為Mono的OpenSourceProject則實際完成了跨語言與跨平台的目標。【Mono:OpenSourceProject】Mono提供了C#、Java、VisualBasic.NET、JavaScript、PHP、ObjectPascal、Python以及其他語言的編譯器，並且也能夠安裝在Linux、SunSolaris(Unix)、BSD（含FreeBSD）、MacOSX（含iPhoneOS）、MicrosoftWindows甚至是Wii等機器上。但由於是OpenSourceProject，故本書不多加介紹，有興趣的讀者可以連至下列網址查詢。/441.3 .NETFramework

與VisualStudioVisualStudio是微軟提供程式設計師開發程式的一套IDE整合開發環境，對於開發.NETFramework的程式而言（例如VB.NET、C#、ASP.NET），使用的是VisualStudio.NET版本。而VisualStudio.NET又分為Express版、使用者端版（含專業版、企業版、企業旗艦版）、品管人員版與伺服器端及其他產品版（含TEAMFOUNDATIONSERVER/TEAMEXPLOREREVERYWHERE/LABMANAGEMENT版）等。其中，Express版是提供給初學者（例如學生）使用，是一個免費的版本並且可以由微軟網站下載，網址如下：/express/451.3 .NETFramework

與VisualStudio請下載圖1-9/express/（下載VWDExpress2010中文版）461.3 .NETFramework

與VisualStudio本書使用的為Express2010中文版而Express版包含四種開發軟體，VisualBasic、VisualC#、VisualC++以及VisualWebDeveloper等。要開發ASP.NET程式則請安裝VisualWebDeveloper2010（簡稱VWD2010）。註：下載完畢，請一同下載最新的ServicePack。471.4 ASP.NET與VWD除了視窗應用程式之外，Web應用程式也被包含在.NETFramework的規範中，也就是ASP.NET。ASP.NET包含開發WebForms與WebServices兩類，在本書開發的ASP.NET網頁程式都屬於WebForms。要開發ASP.NET程式則請安裝VisualWebDeveloper2008（簡稱VWD2008）。

簡言之，本書所使用的工具包含IDE、.NETFramework（含CLR）、SQLServerExpress資料庫、Web伺服器等，其中IDE即為VWD2010，而在安裝VWD完成後，也同時安裝了.NETFramework與SQLServerExpress資料庫（需勾選）。至於Web伺服器，在VWD2005以前都必須搭配IISWeb伺服器來執行，但VisualStudio或VWD2008以後的版本則本身已經內建虛擬的Web伺服器（稱之為ASP.NET程式開發伺服器），因此不需要安裝IIS也能夠開發Web應用程式。481.4 ASP.NET與VWDASP.NET的編譯與執行ASP.NET可以使用VB.NET或C#語法來開發程式，本書使用的是VB.NET語法。ASP.NET程式碼的副檔名為.aspx，當使用者第一次要求網站執行ASP.NET網頁（.aspx檔）時，會自動使用編譯器編譯為中間碼組件檔。通常它會對每個應用程式目錄(例如App_Code)建立組件，也會為主目錄建立一個組件(若使用不同程式設計語言所撰寫，則會為每一種語言建立不同的組件)，這些組件檔會被存放在暫時目錄，此動作稱之為自動編譯，速度較慢一些。

1.4 ASP.NET與VWD當編譯完成後，實際執行時，則由CLR執行中間碼產生HTML格式碼回傳給客戶端（其流程如圖1-10a所示）。至於之後其他使用者欲連上此ASP.NET網頁時，則不必再進行編譯，CLR可直接執行中間碼產生HTML格式碼回傳給客戶端，因此速度較快（而這些已編譯的中間碼則被視為快取檔案），流程如圖1-10b。而傳統ASP網頁，則必須每一次都經由asp.dll直譯ASP原始碼，故ASP.NET的平均效率比單純直譯的ASP與PHP還要好。49501.4 ASP.NET與VWD圖1-10aASP.NET執行過程（第一次執行ASP.NET）51圖1-10bASP.NET執行過程（非第一次執行ASP.NET）【ASP.NET的彈性部署】由於第一次會自動進行編譯的特性，因此，若您想要將ASP.NET網頁部署到其他的Web伺服器（例如IIS），直接複製原始程式檔即可。不過如果您可以選擇先行編譯，也就是在部署網站前，使用ASP.NET編譯器工具(ASPNET_Compiler.exe)先行編譯網站，就可以部署組件取代原始程式碼。而ASP.NET編譯器工具提供了包含就地編譯、非可更新的完全先行編譯、可更新的先行編譯等選項。521.5 類別／物件VB.NET或C#都是物件導向程式語言（OOPL；Object-OrientedProgramLanguage），而ASP.NET由於採用這兩種語法，因此ASP.NET是一個物件導向型式的網頁程式設計，所謂物件導向的設計理念，就是利用軟體模擬現實生活中實體所擁有的特性與行為，這些實體就是物件，而每一個物件都擁有各自的屬性（Property）、方法（Method）及事件（Event），物件導向程式設計就是依照物件的方法產生互動以完成要求。由於ASP.NET採用物件導向式設計，因此在繼續之後的學習之前，我們應該先對物件導向程式設計有基本的認識，重點說明如下：531.5 類別／物件物件(Object)真實世界中所有具體或抽象的事物，都可以將之視為一個『物件』。例如：您可以把一架戰鬥機想像成是一個物件（Object）；而戰鬥機的零件（例如：座椅、引擎、操縱桿）則是較小的物件，明顯地，這些物件仍舊可以再細分為更小的物件（例如：螺絲釘）。ASP.NET的物件則是一些程式碼和資料組合，物件必須能夠單獨成為一個完整單元，也可以組合成更大的物件。例如：一個按鈕或一個Page都是一個物件，但Page網頁物件內可以包含按鈕物件。屬性(Property)物件擁有許多特性，這些特性代表了一個物件的外觀或某些性質，例如：戰鬥機物件的最高速度就代表了該戰鬥機的一種特性。這些特性在物件導向程式設計中稱之為屬性（Property）541.5 類別／物件事實上，有的時候在取得物件的某些屬性時，所得到的也可能是另一個（子）物件。例如：戰鬥機的引擎也是一個物件，而且它仍舊可以由更多更小的零件來組成，同時引擎物件也存在自己的方法（Method），例如：引擎點火。

本書的ASP.NET網頁使用VB.NET語法，而在VB.NETT中，每個物件同樣也具備某些特性，這些特性亦稱為欄位或屬性，例如：按鈕物件的屬性包含按鈕長寬大小、按鈕背景顏色、按鈕文字等等。大多數物件的欄位都有某些預設值，在程式設計或執行階段，我們可以藉由改變欄位值來改變整個物件的某些特性，完成我們想要的物件表示形式。例如：將飛機物件的機殼漆成紅色，將按鈕背景顏色設為藍色。註：VB.NET的屬性除了具有欄位資料的特性之外，也可以設定set與get程序的內容以進行該項資料的存取。551.5 類別／物件類別(Class)不同的物件也可以擁有相同的屬性，而我們可以依照物件所擁有的屬性將物件加以分類，此分類的結果稱之為『類別』。事實上，在物件導向程式設計中類別與物件的關係，是先有類別，然後才有該類別下衍生出來的各個物件，而同屬一個類別的物件擁有相同的屬性（定義於類別中），透過屬性值的不同，就可以製造該類別下各種型式的物件。例如：『飛機』是一個類別，而「民航機」和「戰鬥機」都是該類別下所衍生的物件，因為兩者都具有速度、爬升力、重量、載重量…等等的屬性，但由於屬性值的不同，因此我們可以區分出民航機物件與戰鬥機物件。

1.5 類別／物件以ASP.NET程式設計而言，假設某一個Page網頁中包含許多按鈕，則每一個按鈕都是一個物件，隸屬於按鈕類別之下，但是由於按鈕的名稱不同，因此視為不同且獨立的物件，而按鈕類別並不需要由我們來設計，因為它屬於ASP.NET內定類別庫的類別。在本書中，我們幾乎不會自行設計類別，只會使用現成的類別產生物件，並且控制項類的物件也是以拖拉方式來完成宣告，而不需要自行撰寫宣告物件的語法。56571.5 類別／物件方法(Method)每個物件都擁有不同數量的『方法』（同一類別下的物件則擁有相同名稱的方法，但方法的細節內容則可以不同）。所謂方法(Method)，就是為了完成該物件某些目標的處理方式。例如：戰鬥機物件有許多方法使得戰鬥機變得有些用途，這些方法如起飛、降落、逃生等等。每個方法都有許多的細節，例如起飛，可能包含『發動引擎、、、、直到拉動操縱桿』，這些就是起飛方法的細節。

ASP.NET提供了許多物件的方法（ASP.NET完成了這些方法的細節），這樣的好處就在於我們並不需要了解這些方法的細節，就能夠完成目標，例如亂數物件（RandomObject）提供了取亂數的Next方法，我們只要