網頁技術簡介
Web應用程式的基礎- WWW與主從架構系統(說明) 「WWW」(World Wide Web,簡稱Web)全球資訊網是 1989年歐洲高能粒子協會一個研究小組開發的Internet服務, Web能夠在網路上傳送圖片、文字、影像和聲音等多媒體資 料,這是由Tim Berners Lee領導的小組開發的主從架構和分 散式網路服務系統。 WWW全球資訊網是一種主從架構系統,在主從架構的主端 是指伺服端(Server)的Web伺服器,儲存HTML網頁、圖 片和相關檔案,從端是客戶端(Client),也就是使用者執 行瀏覽器的電腦,負責和伺服器溝通和讀取伺服器的資料, 其傳送的是HTML網頁、圖檔和相關檔案。
Web應用程式的基礎- WWW與主從架構系統(圖例) 在Web伺服器儲存資料,以微軟來說就是「IIS」(Internet Information Services),從端使用瀏覽器取得與顯示伺服 端的資料,例如:Internet Explorer瀏覽器。
Web應用程式的基礎- HTTP通訊協定 HTTP通訊協定(Hypertext Transfer Protocol)是一種在伺 服端(Server)和客戶端(Client)之間傳送資料的通訊協 定,如下圖所示:
Web應用程式的基礎- HTTP通訊協定的特性 HTTP通訊協定並不會持續保持連線:只有當瀏覽器提出請求 時才建立連線,在請求後就斷線等待回應,每一次請求和回 應都需要事先建立連線。 HTTP通訊協定並不會保留狀態:因為HTTP通訊協定並不會保 持連線,所以在連線時,伺服端和客戶端互相知道對方,一 旦請求結束,就互不相干,所以使用者狀態並不會保留,每 一次連線都如同是一位新使用者。
Web應用程式的基礎- Web應用程式(說明) Web應用程式(Web Applications)簡單的說是一組網頁 (包含HTML網頁、圖片和相關伺服端網頁技術的程式檔案) 的集合,請注意!Web應用程式是在Web伺服器執行,並 不是在客戶端電腦的瀏覽器執行。 Web應用程式主要的功能是回應使用者的請求,並且與使用 者進行互動,以ASP.NET技術來說,就是建立ASP.NET網站 的Web應用程式。目前Internet擁有多種不同類型的Web應 用程式,例如:網路銀行、電子商務網站、搜尋引擎、網路 商店、拍賣網站和電子公共論壇等。
Web應用程式的基礎- Web應用程式(圖例) Web應用程式就是一種「Web基礎」(Web-Based)的資 訊處理系統(Information Processing Systems),如下圖 所示:
1-2 網頁設計技術 1-2-1 客戶端網頁技術 1-2-2 伺服端網頁技術
1-2-1 客戶端網頁技術-說明 客戶端網頁技術是指程式碼或網頁是在使用者客戶端電腦的 瀏覽器中執行,因為瀏覽器本身支援直譯程式,所以可以執 行客戶端網頁技術,如下圖所示:
1-2-1 客戶端網頁技術-種類1 Java Applet:使用Java語言撰寫一種Java應用程式,我 們需要使用編譯程式將原始程式碼編譯成位元組碼,即Java Applet,瀏覽器需要使用Java直譯程式「JVM」(Java Virtual Machine)來執行。 JavaScript(Jscript):JavaScript是Netscape開發的一 種Script腳本語言,淺顯的程式語法,就算初學程式設計者 也可以運用自如,輕鬆在網頁上建立互動效果;Jscript為微 軟推出相容JavaScript的Script語言,簡單的說,Netscape 或Mozilla Firefox支援JavaScript;Internet Explorer支援 Jscript。
1-2-1 客戶端網頁技術-種類2 ActionScript與Flash:ActionScript是Macromedia公司開 發的一種Script腳本語言,可以讓Flash動畫電影檔產生互動 效果,這是一種類似JavaScript語法的腳本語言。Flash是 Macromedia公司的軟體名稱,可以用來建立動畫效果,瀏 覽器只需安裝Flash播放程式,就可以在網頁顯示Flash檔案 建立的動畫效果。我們可以使用Flash和ActionScript來輕鬆 建立動畫效果的網頁應用程式。 VBScript:VBScript是Visual Basic語言家族的成員,全名 Microsoft Visual Basic Scripting Edition,簡稱VBScript。 VBScript是一種完全免費的直譯程式語言,它也是一種在瀏 覽器執行的網頁語言,能夠讓網頁設計者開發互動多媒體的 網頁內容,目前只有微軟Internet Explorer瀏覽器支援 VBScript。
1-2-1 客戶端網頁技術-種類3 DHTML:「DHTML」(Dynamic HTML)是一種在瀏覽器 建立HTML動態效果的技術,主要是由三種元素所組成: HTML、CSS和Script語言。 Ajax:Ajax是Asynchronous JavaScript And XML的縮寫, 譯成中文就是非同步JavaScript和XML技術,Ajax技術是由 HTML和CSS、XML、XML DOM和XMLHttpRequest物件所 組成。 Silverlight:Silverlight是一套用來開發豐富網際網路應用程 式(Rich Internet Application,RIAs)的工具程式,其定 位和Macromedia公司的Flash相同,這是微軟開發的RIA工 具,提供網頁設計師另一種建立豐富網頁內容的選擇。
1-2-2 伺服端網頁技術-說明 伺服端網頁技術是在Web伺服器上執行的應用程式,而不是 在客戶端電腦的瀏覽器執行,如下圖所示:
1-2-2 伺服端網頁技術-種類1 CGI(Common Gateway Interface):共通匣道介面提 供Web伺服器執行外部程式的管道,CGI應用程式是一種外 部程式的執行檔,能夠使用各種程式語言來開發,例如: Visual Basic、C、C++和Perl,程式需要編譯成執行檔案, 以便在伺服端執行。 ASP(Active Server Pages):英文字面上是一種讓網頁在 伺服器上動起來的技術,能夠將Script語言內嵌HTML標籤的 網頁,在伺服端產生動態網頁內容,這是一種在伺服端以直 譯方式執行的網頁技術。
1-2-2 伺服端網頁技術-種類2 ASP.NET:ASP.NET是繼ASP 3.0後,微軟開發的伺服端網頁 技術,以「CLR」(Common Language Runtime)架構 的.NET程式設計平台,可以讓我們使用CLR語言在伺服端建 立Web應用程式。 PHP(PHP: Hypertext Preprocessor):一種通用和開放原 始碼(Open Source)的伺服端Script語言,可以直接內嵌 於HTML網頁,特別適用在Web網站的開發,主要是使用在 Linux/Unix作業系統的伺服端網頁技術,目前也支援 Windows作業系統。
1-2-2 伺服端網頁技術-種類3 JSP(Java Server Pages):Java家族中和ASP一較長短 的網頁技術,以Java語言來說,Java Applet是下載到客戶 端執行的程式檔;Java Servlet是在伺服端執行;JSP是結合 HTML和Java Servlet的一種伺服端網頁技術。
1-3 ASP.NET與.NET Framework
1-3-1 .NET Framework-說明 .NET Framework是微軟下一個世代的程式開發平台,它是 由CLR和.NET Framework類別函數庫所組成。當我們使 用.NET Framework支援的程式語言編寫程式碼檔案後,就 可以使用.NET編譯程式進行編譯,不過,.NET Framework 不是編譯成CPU可執行的機器語言,而是一種中間程式語言 稱為「MSIL」(Microsoft Intermediate Language)。
1-3-1 .NET Framework-圖例 當需要執行程式時,CLR是使用「JIT」(Just In Time)編譯 程式將MSIL轉換成機器語言來執行程式,如下圖所示:
1-3-1 .NET Framework-類別函數庫 .NET Framework類別函數庫(.NET Framework Class Library,簡稱.NET FCL)提供龐大的類別物件,幫助我們建 立各種應用程式,只需支援.NET Framework的程式語言都 可以使用類別函數庫的物件和方法。
1-3-2 ASP.NET技術的三種開發模型- 說明 ASP.NET是一種架構在.NET Framework的CLR平台的網頁技 術,其主要目的是建立Web應用程式。目前ASP.NET共有三 種開發模型來建立ASP.NET應用程式,如下圖所示:
1-3-2 ASP.NET技術的三種開發模型- ASP.NET Web Forms開發模型 傳統ASP.NET開發模型,這是一種事件驅動和伺服端控制項 的開發模型,其目的是隱藏HTTP請求,使用伺服端控制項來 全權處理頁面顯示,以便讓我們如同建立桌上型Windows Form應用程式一般的建立Web應用程式。
1-3-2 ASP.NET技術的三種開發模型- ASP.NET Web Pages開發模型 ASP.NET開發模型的最新成員,這是一種以頁面為中心的開 發模型,類似ASP和PHP技術,可以讓開發者全權控制網頁 的顯示,和整合客戶端網頁技術的各種套件,並且使用內建 範本和幫助者類別來快速建立Web應用程式。
1-3-2 ASP.NET技術的三種開發模型- ASP.NET MVC開發模型 使用著名MVC設計模式來建立Web應用程式,可以將Web 應用程式分割成三大部分Models、Views和Controllers,分 別是資料、顯示和處理請求,在顯示部分預設是和Web Pages開發模型使用相同的Razor語法。