IT兄弟連 JavaWeb教程 AJAX定義以及解決的問題

• 2019 年 10 月 5 日
• 筆記

版權聲明：本文為部落客原創文章，遵循 CC 4.0 BY-SA 版權協議，轉載請附上原文出處鏈接和本聲明。

本文鏈接：https://blog.csdn.net/ITXDL123/article/details/90761526

Ajax是"Asynchronous JavaScript And XML"的縮寫(即：非同步的JavaScript和XML)，是一種實現無頁面刷新獲取伺服器數據的混合技術,Ajax這個概念的最早提出者是Jesse James Garrett。我們知道，互聯網最主要的功能在於"資源交換"，當初發明互聯網的科學家們也是基於這個動機。雖然在互聯網中"資源交換"的主體都是電腦。但為了方便交流，我們通常將獲取資源的一方稱為客戶端（主要的工具是瀏覽器），而將派發資源的一方稱為服務端。

在AJAX技術出現之前，如果瀏覽器需要從伺服器請求資源，其交互模式為"客戶端發出請求 -> 服務端接收請求並返回相應HTML文檔 -> 頁面刷新，客戶端載入新的HTML文檔"。確實，這種交互模式十分簡潔明了，而且非常符合人的直覺，對於那時遊走於互聯網中的極客而言，也確實夠用了。但是隨著時代的進步，互聯網漸漸不只是極客們的娛樂場，越來越多商業化網站的出現，使互聯網不再局限於滿足人們"資源交換"的需求，人們開始期待能夠在互聯網中獲得更好的"使用體驗"，而隨著用戶點擊不斷刷新頁面的交互方式顯然很難討人喜歡。

AJAX技術的問世，不僅通過阻止瀏覽器接受響應時刷新頁面提升了互聯網用戶的使用體驗，還使開發者能夠以更加微觀的視角重新思考互聯網應用的構建，從此，開發者將在"數據"層面而不是"資源"層面以更高的自由 度構建網站和Web應用。

有沒有辦法在頁面數據變動時，只向伺服器請求新的數據，並且在阻止頁面刷新的情況下，動態的替換頁面中展示的數據呢？ — 答案正是"AJAX"。

再試想這樣一種情景，當用戶點擊頁面中的某個按鈕向伺服器發送請求時，頁面本質上只是一些數據發生了變化，而此時伺服器卻要將重繪的整個頁面再返回給瀏覽器載入，這顯然有悖於程式設計師的"DRY"原則，而且明明只是一些數據的變化卻迫使伺服器要返回整個HTML文檔，這本身也會給網路頻寬帶來不必要的開銷。

經典Web應用程式模型的工作方式如下：

用戶介面中的大多數用戶操作都會將HTTP請求觸發返回Web伺服器。伺服器進行一些處理-檢索數據、處理數字、與傳統系統對話，然後向客戶端返回HTML頁面。這種方法具有很多技術意義，但是它並不能為用戶帶來出色的體驗。雖然伺服器正在做它應該做的事情，但是在伺服器工作時用戶只能等待它完成。

圖1 傳統Web應用與使用AJAX的Web應用

顯然，如果我們重新設計Web應用程式，我們就不會讓用戶等待。我們通過在用戶和伺服器之間引入中介(Ajax引擎)，Ajax應用程式消除了Web上交互的啟動-停止-啟動-停止性質，瀏覽器不是載入網頁，而是在會話開始時載入一個Ajax引擎-用JavaScript編寫。該引擎負責呈現用戶看到的介面並代表用戶與伺服器通訊。Ajax引擎允許用戶與應用程式的交互非同步進行-與伺服器的通訊無關。因此，用戶就不會在盯著空白的瀏覽器窗口和等待載入的圖標或者等待伺服器處理結束了。

同步的過程只有允許有一個進程在執行，比如服務端在處理數據的時候，那麼客戶端不能進行任何操作，處於一個阻塞的一個狀態。

使用ajax的程式，服務端在處理數據的時候，客戶端瀏覽器依然可以執行其他的操作，並沒有阻塞狀態，也就是一個時間段內可以有多個進程在執行。

圖2 傳統Web應用運行流程

圖3 使用AJAX的Web應用運行流程