開發保留標準的瀏覽器功能的AJAX應用

ajax|標準|瀏覽器 摘要AJAX應用因為它們的表現力的豐富、更加互動和更加迅速的響應得到了讚揚聲；這些優點都是通過使用XMLHttpRequest對象來動態載入資料而獲得的，而不是重新載入新的頁面。在大量的宣傳和刺激中，卻有一些批評的聲音指出，AJAX應用破壞了一些重要的瀏覽器特性，這其中包括對前進/後退按鈕的支援。本文首先解釋了為什麼除非明確的將那些功能做進AJAX應用，否則前進/後退按鈕和其他一些瀏覽器功能不能正常工作。然後簡單的列出開發人員如何解決上述問題，最後我們將詳細的看一看Backbase AJAX引擎是如何提供對前進/後退按鈕和其他一些瀏覽器功能的支援的。  AJAX 應用需要一個後退按鈕嗎？AJAX確保允許開發人員僅僅使用標準的瀏覽器技術開發有更好使用者體驗的和高度互交的WEB應用，這種技術常常是指DHTML。以前，開發人員常常不得不在 rich和 reach之間做出選擇；前者是指具有高度互交性的互動使用者介面，後者是指一個運行在所有WEB瀏覽器上的、不用額外的安裝機制的前台終端。AJAX應用將使得前台終端既“rich”又“reach”。但是到底什麼是真正的一個介面“rich”的含義呢？而什麼又是一個應用“reach”的含義呢？“rich”的概念不容易定義，但是容易被直觀的感受。如果你看到一個“rich”介面，你將明白什麼是“rich”介面。案頭應用像微軟的Office就是一個“rich”的介面。一個“rich”的介面使用先進的UI控制技術，如Tabs和操作功能表。它們提供前進的互交手段，像當它們獲得焦點的時候，UI元素的drag-and-drop和highlighting。傳統的瀏覽器應用不是“rich”的。它們被限制在一些簡單的控制器裡，像Form，而互動只是簡單的依靠點選連結到一個新的頁面。看看微軟的email用戶端就能看出其中的差別：Outlook是“rich”的，而hotmail則不是。AJAX應用因為它們的富有的表現力而得到表揚，Google的Gmail就是一個經常提及的例子。其他的Google所做的AJAX應用，如Google Suggest和Google Map。微軟即將發布的Web mail用戶端，代號為：“Kahuna”，或者 Backbase RSS Reader也包含了進階的控制器和互交的模型。看一看Dan Grossman的列表： Top 10 Ajax Applications，那裡是一些激動人心的關於“rich”介面的列表。因此我可以得出結論，AJAX應用很明白的滿足“rich”的概念。但是它是否滿足“reach”呢？在AJAX應用的絕大多數基本表單裡，如果介面運行在一個WEB瀏覽器裡，那麼這個應用是“reach”的。AJAX應用是基於標準的瀏覽器的，因此能夠被一個瀏覽器所訪問。但是，僅僅被瀏覽器所理解還是不夠的。Jakob Nielson在他的文章 Flash: 99% Bad裡，指出Flash：“破壞了WEB的基本的互動風格”。在使用WEB應用的時候，終端使用者期望一個確定的互動風格。應用需要提供傳統的WEB互動風格，並且提供如下的可用性特性：。必須提供“後退/前進”按鈕，使用者能夠瀏覽網頁曆史紀錄。使用者能夠使用書籤。必須提供Deep links，以便使用者能夠將其通過email發送給朋友或同事。必須提供[重新整理] 按鈕，用來重新整理目前狀態，而不是通過重新初始化應用來獲得。開發人員可以通過使用“view source”來查看原始碼。終端使用者能夠使用“find”來搜尋網頁面。搜尋引擎能夠對網頁編索引，能夠產生一個Deep link來搜尋它們看一看10個頂級的AJAX應用，表明大多數的當前AJAX應用的確破壞了WEB的基本互動風格。在接下來的部分裡，我們將看一看為什麼很多的AJAX應用會這樣。  為什麼AJAX 應用經常性的破壞了後退按鈕？我們今天所知道的WEB牢固的建立在以下三個原則的基礎上：。使用（D）HTML建立的介面。使用HTTP為客戶/伺服器通訊。使用URIs定址上面的原則決定了我們所擷取的WEB應用有一定的局限性，而AJAX應用正是通過衝破這種局限性的限制而使得介面變得更加豐富。正像我以前的文章： A Backbase Ajax Front-end for J2EE Applications所解釋的。AJAX引入了廣泛使用的java script（AJAX中的J）來建立豐富的UI介面控制器和互動。AJAX也引入了非同步XML通訊（AJAX中的A和X），這是通過引入XMLHttpRequest對象來載入新的資料和表現層邏輯，而沒有頁面重新整理。然而，當前的AJAX模型，不能夠定位如何處理URIs。作為改變使用（D）HTML和HTTP的一個直接後果，AJAX應用破壞了作為WEB基本互動風格的後退按鈕和其他的元素。在本文餘下的部分，我將解釋如何在AJAX方式下通過處理URIs來修補這種破壞。我首先將說一說為什麼URIs會和傳統的WEB應用的互動有關係。使用者互動用術語來說就是使用者介面的狀態發生了改變。終端使用者發起了狀態改變，瀏覽器用戶端通過發送頁面請求到伺服器的方式來處理狀態變化（REST原則），伺服器通過發送一個新的頁面和新的URIs到用戶端來產生一個新的介面狀態。簡而言之，每一個使用者互動是這樣別處理的，通過伺服器的迴圈產生如下的結果：。產生一個新的頁面。產生一個新的URI因為瀏覽器記錄了連續的URIs到它的曆史堆棧裡，並且將當前的URI顯示在地址欄裡，WEB的可用性特性就被啟用。在地址欄裡，使用者可以拷貝URI，並且可以把它發送給朋友。當使用者點擊返回按鈕或從email裡粘貼一個URI到地址欄裡，一個到伺服器的迴圈就被觸發。由於伺服器負責狀態管理，那麼伺服器就能產生相應的頁面。AJAX應用和傳統的WEB應用的最大的不同在於AJAX應用能夠不通過頁面的重載而處理使用者的互動。通過XMLHttpRequest對象從伺服器載入資料就是一個例子。使用java script處理用戶端drag-and-drop是另外的一個例子。在上面的兩個例子中，狀態的變化不是通過產生一個新的URI得到的。因此，點擊後退按鈕或者重新整理按鈕不能得到想要的效果，並且在地址欄裡沒有deep-link的URI。為了提供傳統的WEB可用性特性，AJAX應用需要像傳統的WEB應用一樣來處理URIs用戶端。因此AJAX應用需要做如下的事：。當一個用戶端狀態變化時，產生一個URI，並且發送到用戶端。當一個新的URI被用戶端請求時，儲存狀態做到了上面的兩點，瀏覽器的曆史紀錄將會工作，瀏覽器的地址欄將顯示一個能發送給朋友的URI。另外一個困難是決定什麼時候AJAX引擎應該做上面的那兩件事（例如，什麼樣的狀態變化將導致產生一個新的URI）。在傳統的模式中，每一個頁面重新整理都導致一個URI的更新。在AJAX模式中，每一個用戶端事件都可能產生一個URI到瀏覽器堆棧。互動設計師和開發人員將決定什麼樣的狀態變化是有意義的。因而只對那些有意義的狀態變化產生新的URI。