網路應用程式

<image>

網路應用程式（web application，英文簡稱 Webapp）分為客戶端到伺服器架構或無伺服器後端架構。其中的客戶端就是網頁瀏覽器。常見的網頁應用程式有Webmail、網路購物、網路拍賣、wiki、網路論壇、部落格、網路遊戲等諸多應用。

網路應用程式風行的原因之一，是因為可以直接在各種電腦平台上執行，不需要事先安裝或定期升級等程序。

## 定義及類似術語

各種類型的動態網頁和「網路應用程式」之間的區別一般是不清楚的。最有可能接近「網路應用程式」的網站是與桌面軟體應用程式或行動應用程式具有類似功能的網站。HTML5引入了明確的支持，使得應用程式可以作為網頁加載，可以在本地存儲數據並在脫機狀態下繼續運行。

單頁應用更類似於應用程式，因為它們沒有使用不同的URL切換操作界面。像 Sencha Touch 和 AngularJS 這樣的單頁網頁框架可能會被用來為移動平台開發這樣的網頁應用。

### 移動web應用程式

在製作Web應用程式時，有幾種定位行動裝置的方法：

- 響應式網頁設計可用於製作網路應用程式 - 無論是傳統網站還是單頁應用程式，都可以在小螢幕上查看，並且可以很好地與觸控螢幕配合使用。
- 漸進式網頁應用程式是常規網頁或網站和行動應用程式的混合體。
- 原生應用程式或「行動應用程式」直接在行動裝置上運行，就像常規軟體應用程式直接在台式電腦上運行一樣，而無需Web瀏覽器（並且可能不需要Internet連接）; 這些通常是用Java（Android設備）或Objective C或Swift（用於iOS設備）編寫的。最近，像React Native，Flutter和Xamarin這樣的框架允許使用不同於每種標準本地語言的語言來開發所有平台的本地應用程式。
- 混合應用程式在本地應用程式中嵌入移動網站，可能使用混合框架（如 Apache Cordova 和 Ionic 或 Appcelerator Titanium）。這允許使用網路技術進行開發（並且可能直接複製來自現有移動網站的代碼），同時還保留原生應用的某些優點（例如，直接訪問設備硬體，離線操作，應用商店可見性）。

## 歷史

在較早的網路架構（如客戶機 - 伺服器）中，應用程式的處理負載在伺服器上的代碼和本地安裝在每個客戶機上的代碼之間共享。換句話說，一個應用程式有自己的預編譯客戶端程序作為其使用者界面，必須分別安裝在每個使用者的個人電腦上。升級到應用程式的伺服器端代碼通常還需要升級到安裝在每個使用者工作站上的客戶端代碼，這增加了技術支持成本並降低了生產力。此外，應用程式的客戶端和伺服器組件通常都與特定的電腦系統結構緊密相連，作業系統並將它們移植到其他作業系統對於除了最大的應用程式之外的所有作業系統而言都是非常昂貴的 （現在，用於行動裝置的本地應用程式也受到一些或所有上述問題的困擾。）

相反，網頁應用程式使用由各種網頁瀏覽器支持的標準格式（如HTML和JavaScript）編寫的網頁。網頁應用程式可被視為客戶端 - 伺服器軟體的特定變體，其中客戶端軟體在使用諸如HTTP的標準程序訪問相關網頁時被下載到客戶端機器。每次訪問網頁時都可能會發生客戶端網頁軟體更新。在會話期間，網頁瀏覽器解釋並顯示頁面，並作為任何網頁應用程式的通用客戶端。

在全球資訊網的早期，每個單獨的網頁作為一個靜態文檔被傳送到客戶端，但是由於使用者輸入是通過嵌入在頁面標記中的網頁的元素返回的，所以頁面的順序仍然可以提供交互式的體驗。但是，每次對網頁的重大更改都需要往返伺服器以刷新整個頁面。

1995年，網景引入了一種稱為JavaScript的客戶端腳本語言，允許程式設計師在客戶端運行的使用者界面中添加一些動態元素。因此，為了生成整個網頁而不是將數據發送到伺服器，下載頁面的嵌入腳本可以執行各種任務，例如輸入驗證或顯示/隱藏頁面的一部分。

1996年，Macromedia引入了Flash，這是一種矢量動畫播放器，可以作為插件添加到瀏覽器中，以在網頁上嵌入動畫。它允許使用腳本語言來編程客戶端的交互，而不需要與伺服器通信。

在1999年，「Web應用程式」概念在Servlet Specification 2.2版中以Java語言引入。2.1？當時JavaScript和XML已經被開發出來，但Ajax還沒有被創造出來，並且XMLHttpRequest對象在2008年才作為ActiveX對象在Internet Explorer 5上引入。

2005年，Ajax這個詞被創造出來，像Gmail這樣的應用程式開始使他們的客戶端越來越靈活。網頁腳本能夠聯繫伺服器來存儲/檢索數據，而無需下載整個網頁。

在2011年，HTML5被定稿，提供圖形和多媒體功能，而不需要客戶端插件。HTML5也豐富了文檔的語義內容。API和文檔對象模型（DOM）不再是事後的，而是HTML5規範的基礎部分。WebGL API為基於HTML5的canvas和JavaScript語言的高級3D圖形鋪平了道路。這些在創造真正的平台和瀏覽器獨立顯著重要性的豐富網際網路應用程式。

## 界面

通過DHTML、Java Applet、JavaFX、JavaScript、Flash、Silverlight等技術，螢幕上的繪圖，播放音訊以及訪問鍵盤和滑鼠等應用程式特有的方法都是可能的。許多服務已經將所有這些組合到了一個更熟悉的界面中，該界面採用了作業系統的外觀。通用技術，如拖放也受到這些技術的支持。Web開發人員通常使用客戶端腳本來添加功能，特別是創建不需要重新加載頁面的交互式體驗。一些技術來協調客戶端腳本和伺服器端技術，如ASP.NET、Java EE、Perl / Plack和PHP。

使用各種技術組合的網頁開發技術AJAX是創造更多交互式體驗的技術示例。

## 結構

應用程式通常被分成稱為「層」的邏輯塊，其中每個層被分配一個角色。傳統的應用程式只包含一層，它駐留在客戶端機器上，但是網頁應用程式本身就是一種n層的方法。儘管可能有許多變化，但最常見的結構是三層應用程式。按照最常見的形式，這三個層次按順序被稱為呈現，應用和存儲。網頁瀏覽器是第一層（呈現），引擎使用一些動態的網頁內容技術（如ASP，CGI，ColdFusion，Dart，JSP / Java，Node.js，PHP，Python或Ruby on Rails）是中間層（應用程式邏輯），資料庫是第三層（存儲）。Web瀏覽器發送請求到中間層，它通過使查詢和更新對資料庫服務他們，並生成使用者界面。

對於更複雜的應用程式，三層解決方案可能不足，使用n層方法可能會有所幫助，其中最大的好處是將駐留在應用程式層上的業務邏輯劃分為更細粒度模型。另一個好處是可以通過提供易於使用的界面來訪問數據，添加一個集成層，將數據層與其他層分開。例如，客戶端的數據將被通過調用一個 "list_clients" 函數，而不是直接使一個SQL查詢針對資料庫上的客戶端表訪問。這樣可以替換底層的資料庫，而不會對其他層進行任何更改。

有一些人將Web應用程式視為兩層架構。這可以是一個「聰明」的客戶端，執行所有的工作，並查詢一個「愚蠢的」伺服器，或一個「愚蠢的」客戶端，依靠一個「聰明的」伺服器。客戶端將處理表示層，伺服器將具有資料庫（存儲層），業務邏輯（應用層）將在其中一個或兩個上。雖然這增加了應用程式的可伸縮性，並將顯示和資料庫分開，但它仍然不允許真正的圖層專業化，所以大多數應用程式將超過這個模型。

## 商業用途

應用軟體公司正在形成的戰略是提供對以前作為本地應用程式分發的軟體的網路訪問。根據應用程式的類型，可能需要開發一個完全不同的基於瀏覽器的界面，或者僅僅調整現有的應用程式以使用不同的演示技術。這些程序允許用戶每月或每年支付使用軟體應用程式的費用，而無需將其安裝在本地硬碟驅動器上。遵循這一戰略的公司被稱為應用服務提供商（ASP），而ASP在軟體行業中正受到越來越多的關注。

這類應用程式的安全漏洞是一個主要問題，因為它可能涉及企業資訊和私人客戶數據。保護這些資產是任何Web應用程式的重要組成部分，並且在開發過程中必須包含一些關鍵的操作區域。這包括認證，授權，資產處理，輸入以及記錄和審計的過程。從一開始就將安全性構建到應用程式中，從長遠來看可能會更有效，而且破壞性更小。

雲計算模型Web應用程式是軟體即服務（SaaS）。有企業應用程式作為SaaS為企業提供固定或使用相關費用。其他Web應用程式是免費提供的，通常從Web應用程式界面中顯示的廣告中產生收入。

## 開發

編寫一個Web應用程式經常使用開源軟體簡化，如Django、Ruby on Rails或Symfony稱為Web應用框架。這些框架有助於快速應用程式開發，讓開發團隊專注於其應用程式的獨特部分，而無需解決諸如使用者管理等常見的開發問題。

使用Web應用程式框架通常可以減少程序中的錯誤數量，通過簡化代碼，並允許一個團隊專注於框架，而另一個專注於實現功能。在網際網路上經常發生黑客攻擊的應用程式中，與安全相關的問題可能由程序錯誤引起。框架還可以促進使用最佳實踐，例如Post/Redirect/Get。

此外，上的應用程式也有發展的潛力，儘管目前沒有太多可行的平台適合這種模式。