了解網路應用程式

上次更新時間 2021年12月20日

Dreamweaver 和更高版本的用戶介面已經簡化。 因此,您在 Dreamweaver 和更高版本中可能會找不到本文所描述的一些選項。 如需詳細資訊,請參閱本文

關於網路應用程式

網頁應用程式是包含部分或完全未確定內容頁面的網站。頁面的最終內容只有在訪客向網頁伺服器請求頁面時才會確定。由於頁面的最終內容會根據訪客的操作而在每次請求時有所不同,因此這種頁面稱為動態頁面。

網頁應用程式是為了解決各種挑戰和問題而建構的。本節說明網站應用程式的常見用途,並提供簡單範例。

網路應用程式的常見用法

網站應用程式對網站訪客和開發人員都有許多用途,包括以下各項:

  • 讓訪客在內容豐富的網站上快速、輕鬆地尋找資訊。

    這種網站應用程式讓訪客能夠按照自己的需要搜尋、整理和導覽內容。範例包括公司內部網路、Microsoft MSDN (www.msdn.microsoft.com) 和 Amazon.com (www.amazon.com)。

  • 收集、儲存和分析網站使用者所提供的資料。

    過去,在 HTML 表單中輸入的資料會以電子郵件訊息的形式傳送給員工或 CGI 應用程式進行處理。網站應用程式可以將表單資料直接儲存到資料庫中,也可以擷取資料並產生網頁報告進行分析。範例包括線上金融頁面、網站商店結帳頁面、調查和用戶回饋表單。

  • 更新經常變更內容的網站。

    網站應用程式讓網頁版設計師無需持續更新網站的 HTML。內容提供者 (例如新聞編輯) 為網站應用程式提供內容,網站應用程式會自動更新網站。範例包括 The Economist (www.economist.com) 和 CNN (www.cnn.com)。

網路應用程式範例

Janet 是一位專業網頁設計師,也是 Dreamweaver 的長期使用者,負責維護一家擁有 1000 名員工的中型公司的內部網路和網際網路網站。有一天,人力資源部的 Chris 來找她解決一個問題。人力資源部管理一個員工健身方案,員工每走路、騎自行車或跑步一英里就能獲得積分。每個員工必須在電子郵件中向 Chris 報告他們每月的英里總數。月底時,Chris 會收集所有電子郵件訊息,並根據員工的積分總數給予小額現金獎勵。

王先生的問題是這項健康方案太過熱門, 現在參與的員工太多,Chris 在每個月底都會被大量電子郵件淹沒。Chris 詢問 Janet 是否有網頁解決方案。

Janet 建議採用基於內部網路的網站應用程式,執行以下工作:

  • 讓員工使用簡單的 HTML 表單在網頁上輸入里程

  • 將員工的里程數儲存在資料庫內

  • 根據里程數資料計算健康點數

  • 讓員工追蹤每月進度

  • 讓 Chris 在每個月底一鍵存取積分總數

    Janet 在午餐時間前使用 Dreamweaver 讓應用程式啟動並執行,Dreamweaver 具備她快速且輕鬆建置此類應用程式所需的工具。

網路應用程式的運作方式

網站應用程式是靜態和動態網頁的集合。靜態網頁是指當網站訪客請求該頁面時不會變更的網頁:網頁伺服器會將網頁傳送到請求的網頁瀏覽器而不進行修改。相對地,動態網頁會在傳送到要求的瀏覽器之前由伺服器進行修改。頁面不斷變化的特性是其被稱為動態的原因。

例如,您可以設計一個顯示健身結果的網頁,同時保留某些資訊 (例如員工姓名和結果) 以在特定員工要求網頁時決定。

下列章節將更詳細地說明網站應用程式的運作方式。

處理靜態網頁

靜態網站包含一組在執行網頁伺服器的電腦上主機的相關 HTML 網頁和檔案。

網頁伺服器是回應網頁瀏覽器要求來提供網頁的軟體。當訪客按一下網頁上的連結、在瀏覽器中選取書籤或在瀏覽器的位址文字方塊中輸入 URL 時,就會產生頁面要求。

靜態網頁的最終內容由頁面設計師決定,在要求頁面時不會變更。以下是一個範例:

<html>

<head>

<title>Trio Motors Information Page</title>

</head>

<body>

<h1>About Trio Motors</h1>

<p>Trio Motors is a leading automobile manufacturer.</p>

    </正文> 

</html>

網頁 HTML 代碼的每一行都由設計者在將網頁放置在伺服器上之前撰寫。由於 HTML 在伺服器上後不會變更,因此這種網頁稱為靜態網頁。

嚴格說來,「靜態」網頁並不是靜態。 例如,滑鼠變換影像或 Flash 內容 (SWF 檔案) 都會使靜態網頁變得活靈活現。 不過,只要是在傳送到瀏覽器時沒有經過修改的網頁,這本手冊便將它稱為靜態網頁。

當網頁伺服器收到靜態網頁的要求時,伺服器會讀取要求、尋找網頁,並將其傳送到要求的瀏覽器,如以下範例所示:

處理靜態網頁

A. 網頁瀏覽器要求靜態網頁。 B. 網頁伺服器找到網頁。 C. 網頁伺服器將網頁傳送到要求的瀏覽器。 

在網頁應用程式的情況下,當訪客要求頁面時,某些代碼行尚未決定。這些行必須透過某種機制來決定,然後才能將網頁傳送到瀏覽器。此機制將在下節中討論。

處理動態網頁

當網頁伺服器收到靜態網頁請求時,伺服器會直接將該頁面傳送至請求的瀏覽器。然而,當網頁伺服器收到動態頁面請求時,其反應會有所不同:它會將頁面傳遞給負責完成該頁面的特殊軟體。這個特殊軟體稱為應用程式伺服器。

應用程式伺服器讀取頁面上的程式碼,根據程式碼中的指示完成頁面,然後從頁面中移除程式碼。結果是一個靜態頁面,應用程式伺服器將其傳回網頁伺服器,然後網頁伺服器將頁面傳送至請求的瀏覽器。當頁面到達時,瀏覽器所取得的全部內容都是純 HTML。下面是處理過程的檢視:

處理動態網頁

A. 網頁瀏覽器要求動態網頁。 B. 網頁伺服器找到網頁,並將它傳送給應用程式伺服器。 C. 應用程式伺服器掃描網頁上的指示並完成網頁。 D. 應用程式伺服器將完成的網頁傳回給網頁伺服器。 E. 網頁伺服器將完成的網頁傳送到要求的瀏覽器。 

存取資料庫

應用程式伺服器讓您能夠使用伺服器端資源,例如資料庫。例如,動態頁面可能會指示應用程式伺服器從資料庫擷取資料並將其插入頁面的 HTML 中。如需詳細資訊,請參閱 www.adobe.com/go/learn_dw_dbguide_tw

使用資料庫儲存內容可讓您將網站的設計與要向網站使用者顯示的內容分離。您無需為每個頁面撰寫個別的 HTML 檔案,只需為要呈現的不同類型資訊撰寫一個頁面或範本即可。然後您可以將內容上傳到資料庫,並讓網站回應使用者請求時擷取該內容。您也可以在單一來源中更新資訊,然後在整個網站中填入該變更,而無需手動編輯每個頁面。您可以使用 Adobe Dreamweaver 設計網頁表單,以便從資料庫插入、更新或刪除資料。

從資料庫擷取資料的指示稱為資料庫查詢。問題是由以資料庫語言 SQL (結構化問題語言) 表達的搜尋條件組成。SQL 問題會撰寫到頁面的伺服器端指令碼或標記中。

應用程式伺服器無法直接與資料庫通訊,因為資料庫的專屬格式會使資料變得無法解讀,就像在記事本或 BBEdit 中開啟的 Microsoft Word 文件可能無法解讀一樣。應用程式伺服器只能透過資料庫驅動程式作為媒介來與資料庫通訊:這類軟體的作用如同應用程式伺服器和資料庫之間的解譯器。

驅動程式建立通訊後,就會對資料庫執行查詢並建立記錄集。記錄集是從資料庫中一個或多個表格擷取的資料集。記錄集會回傳給應用程式伺服器,應用程式伺服器使用資料來完成頁面。

以下是一個以 SQL 所寫成的簡單資料庫查詢:

SELECT lastname, firstname, fitpoints

FROM employees

此陳述式會建立三欄記錄集,並以包含資料庫中所有員工的姓氏、名字和健康點數的列來填入記錄集。如需詳細資訊,請參閱 www.adobe.com/go/learn_dw_sqlprimer_tw

下列範例顯示了問題資料庫並將資料回傳給瀏覽器的處理程序:

存取資料庫

A. 網頁瀏覽器要求動態網頁。 B. 網頁伺服器找到網頁,並將它傳送給應用程式伺服器。 C. 應用程式伺服器掃描網頁上的指示。 D. 應用程式伺服器將查詢傳送到資料庫驅動程式。 E. 驅動程式針對資料庫執行查詢。 F. 傳回資料集給驅動程式。 G. 驅動程式將資料集傳送到應用程式伺服器。 H. 應用程式伺服器在網頁中插入資料,然後將網頁傳送到網頁伺服器。 I. 網頁伺服器將完成的網頁傳送到要求的瀏覽器。 

您幾乎可以將任何資料庫與您的網站應用程式搭配使用,只要 伺服器上安裝了適當的資料庫驅動程式。

如果您計劃建置 小型低成本應用程式,可以使用檔案型資料庫, 例如在 Microsoft Access 中建立的資料庫。如果您計劃建置強大的企業關鍵 應用程式,可以使用伺服器型資料庫,例如在 Microsoft SQL Server、Oracle 9i 或 MySQL 中建立的資料庫。

如果您的資料庫位於網站伺服器以外的系統上, 請確認兩個系統之間有快速連線, 這樣您的網站應用程式才能快速有效地運作。

撰寫動態網頁

動態網頁的撰寫包含下列事項:先撰寫 HTML、然後在 HTML 中加入伺服器端 Script 或標籤,使網頁變成動態。 當您檢視產生的程式碼時,該語言會以內嵌的形式出現在網頁的 HTML 中, 所以這些語言被稱為 HTML 內嵌程式語言。 下列基本範例使用的是「ColdFusion 標記語言」(CFML):

備註:Dreamweaver 和更新版本已移除 CFML 支援。

<html>

<head>

<title>Trio Motors Information Page</title>

</head>

<body>

<h1>About Trio Motors</h1>

<p>Trio Motors is a leading automobile manufacturer.</p>

<!--- embedded instructions start here --->

<cfset department="Sales">

<cfoutput>

<p>Be sure to visit our #department# page.</p>

</cfoutput>

<!--- embedded instructions end here --->

    </正文> 

</html>

此頁面上的內嵌指令執行下列 動作:

建立名為 department 的變數,並 將字串 「Sales」 指派給它。

在 HTML 代碼中插入 變數的值 「Sales」

應用程式伺服器將下列頁面返回給網站 伺服器:

<html>

<head>

<title>Trio Motors 資訊頁面</title>

</head>

<body>

<h1>關於 Trio Motors</h1>

<p>Trio Motors 是領先的汽車製造商。</p>

<p>請務必造訪我們的銷售頁面。</p>

    </正文> 

</html>

網頁伺服器將頁面傳送至提出要求的瀏覽器,瀏覽器會顯示如下:

關於 Trio Motors

Trio Motors 是領先的汽車製造商。

請務必造訪我們的銷售頁面。

您可以根據伺服器上可用的伺服器技術來選擇要使用的指令碼或標記式語言。以下是 Dreamweaver 支援之伺服器技術的最熱門語言:

伺服器技術

語言

ColdFusion

ColdFusion 標記語言 (CFML)

Active Server Pages (ASP)

VBScript

JavaScript

PHP

PHP

Dreamweaver 可以建立讓您的頁面正常運作所需的伺服器端指令碼或標記,或者您可以在 Dreamweaver 編碼環境中手動編寫。

網路應用程式詞彙

本節定義與網頁應用程式相關的常用術語。

應用程式伺服器

協助網頁伺服器處理包含伺服器端指令碼或標記的網頁的軟體。當從伺服器要求此類頁面時,網頁伺服器會將頁面交給應用程式伺服器進行處理,然後再將頁面傳送至瀏覽器。如需詳細資訊,請參閱網頁應用程式的運作方式

常見的應用程式伺服器包括 ColdFusion 和 PHP。

資料庫

儲存在資料表中的資料集合。資料表的每一列都構成一筆記錄,每一欄都構成記錄中的一個欄位,如下列範例所示:

資料庫

資料庫驅動程式

在網頁應用程式和資料庫之間充當解譯器的軟體。資料庫中的資料是以專有格式儲存。資料庫驅動程式讓網頁應用程式能夠讀取和操控原本無法解讀的資料。

資料庫管理系統

(DBMS 或資料庫系統) 用於建立和操控資料庫的軟體。常見的資料庫 系統包括 Microsoft Access、Oracle 9i 和 MySQL。

資料庫查詢

從資料庫擷取資料集的作業。 問題由以稱為 SQL 的資料庫語言 表達的搜尋準則組成。例如,查詢可以指定記錄集中只包含某些欄或只包含某些記錄。

動態網頁

應用程式伺服器在將頁面傳送 到瀏覽器之前自訂的網頁。

資料集

從資料庫中一個或多個資料表擷取的資料集合,如下列範例:

資料集

關聯式資料庫

包含多個表格的 資料庫,各表格共用 資料。下列資料庫為關聯式資料庫,因為兩個表格共用 DepartmentID 欄。

關聯式資料庫

伺服器技術

應用程式 伺服器用來在執行階段修改動態頁面的技術。

Dreamweaver 開發環境支援 下列伺服器技術:

  • Adobe® ColdFusion®

  • Microsoft Active Server Pages (ASP)

  • PHP: Hypertext Preprocessor (PHP)

    您也可以使用 Dreamweaver 編碼環境來開發任何其他未列出的伺服器技術的頁面。

靜態網頁

應用程式伺服器在將 頁面傳送到瀏覽器之前不修改的網頁。如需詳細資訊,請參閱處理 靜態網頁

網路應用程式

包含部分或完全未確定 內容的頁面的網站。只有當 訪客從網頁伺服器要求頁面時,才會決定這些頁面的最終內容。由於頁面的最終內容會根據訪客的動作而隨每個請求而有所不同,因此這種頁面稱為動態頁面。

網頁伺服器

回應網頁瀏覽器要求而傳送網頁的軟體 。當訪客按一下瀏覽器中網頁上的連結 、在瀏覽器中選取書籤,或在瀏覽器的位址文字方塊中輸入 URL 時,即會產生頁面要求。

常用的 網頁伺服器包括 Microsoft Internet Information Server (IIS) 和 Apache HTTP Server。