1.?靜態(tài)頁(yè)面

在互聯(lián)網(wǎng)最初開(kāi)始的時(shí)候，Web網(wǎng)站的主要內(nèi)容是靜態(tài)的，由文字和圖片組成，制作和表現(xiàn)形式也是以表格為主。當(dāng)時(shí)的用戶(hù)行為也非常簡(jiǎn)單，僅僅是瀏覽網(wǎng)頁(yè)。

2. 多媒體階段

隨著技術(shù)的不斷發(fā)展，音頻、視頻、Flash等多媒體技術(shù)誕生了。多媒體的加入使得網(wǎng)頁(yè)變得更加生動(dòng)形象，網(wǎng)頁(yè)上的交互也給用戶(hù)帶來(lái)了更好的體驗(yàn)。

3. CGI階段

漸漸的，多媒體已經(jīng)不能滿(mǎn)足人們的請(qǐng)求，于是CGI（Common Gateway Interface）應(yīng)運(yùn)而生。CGI定義了Web服務(wù)器與外部應(yīng)用程序之間的通信接口標(biāo)準(zhǔn)，因此Web服務(wù)器可以通過(guò)CGI執(zhí)行外部程序，讓外部程序根據(jù)Web請(qǐng)求內(nèi)容生成動(dòng)態(tài)的內(nèi)容。

在這個(gè)時(shí)候，各種編程語(yǔ)言如PHP/ASP/JSP也逐漸加入市場(chǎng)，基于這些語(yǔ)言可以實(shí)現(xiàn)更加模塊化的、功能更強(qiáng)大的應(yīng)用程序。

4. Ajax

在開(kāi)始的時(shí)候，用戶(hù)提交整個(gè)表單后才能獲取結(jié)果，用戶(hù)體驗(yàn)極差。于是Ajax（Asynchronous Javascript And XML）技術(shù)逐漸流行起來(lái)，它使得應(yīng)用在不更新整個(gè)頁(yè)面的前提下也可以獲得或更新數(shù)據(jù)。這使得Web應(yīng)用程序更為迅捷地回應(yīng)用戶(hù)動(dòng)作，并避免了在網(wǎng)絡(luò)上發(fā)送那些沒(méi)有改變的信息。

5. MVC

隨著Web應(yīng)用開(kāi)發(fā)越來(lái)越標(biāo)準(zhǔn)化，出現(xiàn)了MVC等思想。MVC是Model/View/Control的縮寫(xiě)，Model用于封裝數(shù)據(jù)和數(shù)據(jù)處理方法，視圖View是數(shù)據(jù)的HTML展現(xiàn)，控制器Controller負(fù)責(zé)響應(yīng)請(qǐng)求，協(xié)調(diào)Model和View。

Model，View和Controller的分開(kāi)，是一種典型的關(guān)注點(diǎn)分離的思想，使得代碼復(fù)用性和組織性更好，Web應(yīng)用的配置性和靈活性也越來(lái)越好。而數(shù)據(jù)訪(fǎng)問(wèn)也逐漸通過(guò)面向?qū)ο蟮姆绞絹?lái)替代直接的SQL訪(fǎng)問(wèn)，出現(xiàn)了ORM（Object Relation Mapping）的概念。

除了MVC，類(lèi)似的設(shè)計(jì)思想還有MVP，MVVM等。

6. RESTful

在CGI時(shí)期，前后端通常是沒(méi)有做嚴(yán)格區(qū)分的，隨著解耦和的需求不斷增加，前后端的概念開(kāi)始變得清晰。前端主要指網(wǎng)站前臺(tái)部分，運(yùn)行在PC端、移動(dòng)端等瀏覽器上展現(xiàn)給用戶(hù)瀏覽的網(wǎng)頁(yè)，由HTML5、CSS3、JavaScript組成。后端主要指網(wǎng)站的邏輯部分，涉及數(shù)據(jù)的增刪改查等。

此時(shí)，REST（Representation State Transformation）逐漸成為一種流行的Web架構(gòu)風(fēng)格。

REST鼓勵(lì)基于URL來(lái)組織系統(tǒng)功能，充分利用HTTP本身的語(yǔ)義，而不是僅僅將HTTP作為一種遠(yuǎn)程數(shù)據(jù)傳輸協(xié)議。一般RESTful有以下的特征：

• • api.example.com

  • example.com/api/

  • 域名和主域名分開(kāi)

• • api.example.com/v1

  • api.example.com/v2

  • 帶有版本控制

• • GET /users 獲取所有用戶(hù)

  • GET /team/:team/users 獲取某團(tuán)隊(duì)所有用戶(hù)

  • POST /users 創(chuàng)建用戶(hù)

  • PATCH/PUT /users 修改某個(gè)用戶(hù)數(shù)據(jù)

  • DELETE /users 刪除某個(gè)用戶(hù)數(shù)據(jù)

  • 使用URL定位資源

• • GET 獲取資源，單個(gè)或多個(gè)

  • POST 創(chuàng)建資源

  • PUT/PATCH 更新資源，客戶(hù)端提供完整的資源數(shù)據(jù) 是

  • DELETE 刪除資源

  • 用 HTTP 動(dòng)詞描述操作

• • 使用狀態(tài)碼提高返回?cái)?shù)據(jù)的可讀性

  • 正確使用狀態(tài)碼

• 默認(rèn)使用 JSON 作為數(shù)據(jù)響應(yīng)格式

• 有清晰的文檔

1.1.7. 云服務(wù)

隨著時(shí)間的發(fā)展，Web的架構(gòu)越發(fā)復(fù)雜，負(fù)載均衡、數(shù)據(jù)庫(kù)分表、異地容災(zāi)、緩存、CDN、消息隊(duì)列等技術(shù)開(kāi)始應(yīng)用，增加了Web開(kāi)發(fā)和運(yùn)維的復(fù)雜度。同時(shí)云服務(wù)開(kāi)始逐漸發(fā)展，部署環(huán)境容器化，各個(gè)功能拆成微服務(wù)或是Serverless的架構(gòu)。

?參考：

GitHub 的 Restful HTTP API 設(shè)計(jì)分解 <https://learnku.com/articles/24050>`_

總結(jié)

以上是生活随笔為你收集整理的前端：Web技术的演化史的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。

如果覺(jué)得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。