開發(fā)保留標準的瀏覽器功能的AJAX應用_Xml教程
推薦:使用javascript xml技術實現(xiàn)分頁瀏覽基于web的技術中,分頁是一個老的不能再老的,但大家津津樂道的問題,隨著xml技術的日漸應用,把xml應用到分頁當中,也是一種可能,當然網(wǎng)上的教程很多,當我都是看得稀里糊涂,索性自己寫一個
AJAX應用因為它們的表現(xiàn)力的豐富、更加互動和更加迅速的響應得到了贊揚聲;這些優(yōu)點都是通過使用XMLHttpRequest對象來動態(tài)的載入數(shù)據(jù)而獲得的,而不是重新載入新的頁面。在大量的宣傳和刺激中,卻有一些批評的聲音指出,AJAX應用破壞了一些重要的瀏覽器特性,這其中包括對前進/后退按鈕的支持。
本文首先解釋了為什么除非明確的將那些功能做進AJAX應用,否則前進/后退按鈕和其他一些瀏覽器功能不能正常工作。然后簡單的列出開發(fā)者如何解決上述問題,最后我們將詳細的看一看Backbase AJAX引擎是如何提供對前進/后退按鈕和其他一些瀏覽器功能的支持的。
AJAX應用需要一個后退按鈕嗎?
AJAX許諾允許開發(fā)者僅僅使用標準的瀏覽器技術開發(fā)有更好用戶體驗的和高度互交的WEB應用,這種技術常常是指DHTML。
以前,開發(fā)者常常不得不在rich和reach之間做出選擇;前者是指具有高度互交性的交互式的用戶接口,后者是指一個運行在所有WEB瀏覽器上的、不用額外的安裝機制的前臺終端。AJAX應用將使得前臺終端既“rich”又“reach”。
但是到底什么是真正的一個界面“rich”的含義呢?而什么又是一個應用“reach”的含義呢?
“rich”的概念不容易定義,但是容易被直觀的感受。如果你看到一個“rich”界面,你將明白什么是“rich”界面。桌面應用像微軟的Office就是一個“rich”的界面。一個“rich”的界面使用先進的UI控制技術,如Tabs和上下文菜單。它們提供前進的互交手段,像當它們獲得焦點的時候,UI元素的drag-and-drop和highlighting。傳統(tǒng)的瀏覽器應用不是“rich”的。它們被限制在一些簡單的控制器里,像Form,而交互只是簡單的依靠點擊鏈接到一個新的頁面。看看微軟的email客戶端就能看出其中的差別:Outlook是“rich”的,而hotmail則不是。
AJAX應用因為它們的富有的表現(xiàn)力而得到表揚,Google的Gmail就是一個經(jīng)常提及的例子。其他的Google所做的AJAX應用,如Google Suggest和Google Map。微軟即將發(fā)布的Web mail客戶端,代號為:“Kahuna”,或者Backbase RSS Reader也包含了高級的控制器和互交的模型?匆豢碊an Grossman的列表:Top 10 Ajax Applications,那里是一些激動人心的關于“rich”界面的列表。
因此我可以得出結(jié)論,AJAX應用很明白的滿足“rich”的概念。但是它是否滿足“reach”呢?
在AJAX應用的絕大多數(shù)基本表單里,如果界面運行在一個WEB瀏覽器里,那么這個應用是“reach”的。AJAX應用是基于標準的瀏覽器的,因此能夠被一個瀏覽器所訪問。
但是,僅僅被瀏覽器所理解還是不夠的。Jakob Nielson在他的文章Flash: 99% Bad里,指出Flash:“破壞了WEB的基本的交互風格”。在使用WEB應用的時候,終端用戶期望一個確定的交互風格。應用需要提供傳統(tǒng)的WEB交互風格,并且提供如下的可用性特性:
必須提供“后退/前進”按鈕,用戶能夠瀏覽網(wǎng)頁歷史紀錄
用戶能夠使用書簽
必須提供Deep links,以便用戶能夠?qū)⑵渫ㄟ^email發(fā)送給朋友或同事
必須提供“刷新”按鈕,用來刷新當前狀態(tài),而不是通過重新初始化應用來獲得
開發(fā)人員可以通過使用“view source”來查看源代碼
終端用戶能夠使用“find”來搜索頁面
搜索引擎能夠?qū)W(wǎng)頁編索引,能夠產(chǎn)生一個Deep link來搜索它們
看一看10個頂級的AJAX應用,表明大多數(shù)的當前AJAX應用的確破壞了WEB的基本交互風格。在接下來的部分里,我們將看一看為什么很多的AJAX應用會這樣。
為什么AJAX應用經(jīng)常性的破壞了后退按鈕?
我們今天所知道的WEB牢固的建立在以下三個原則的基礎上:
使用(D)HTML建立的界面
使用HTTP為客戶/服務器通訊
使用URIs尋址
上面的原則決定了我們所獲取的WEB應用有一定的局限性,而AJAX應用正是通過沖破這種局限性的限制而使得界面變得更加豐富。正像我以前的文章:A Backbase Ajax Front-end for J2EE Applications所解釋的。AJAX引入了廣泛使用的java script(AJAX中的J)來創(chuàng)建豐富的UI界面控制器和交互。AJAX也引入了異步的XML通訊(AJAX中的A和X),這是通過引入XMLHttpRequest對象來載入新的數(shù)據(jù)和表現(xiàn)層邏輯,而沒有頁面刷新。然而,當前的AJAX模型,不能夠定位如何處理URIs。
作為改變使用(D)HTML和HTTP的一個直接后果,AJAX應用破壞了作為WEB基本交互風格的后退按鈕和其他的元素。在本文余下的部分,我將解釋如何在AJAX方式下通過處理URIs來修補這種破壞。我首先將說一說為什么URIs會和傳統(tǒng)的WEB應用的交互有關系。
用戶交互用術語來說就是用戶界面的狀態(tài)發(fā)生了改變。終端用戶發(fā)起了狀態(tài)改變,瀏覽器客戶端通過發(fā)送頁面請求到服務器的方式來處理狀態(tài)變化(REST原則),服務器通過發(fā)送一個新的頁面和新的URIs到客戶端來產(chǎn)生一個新的界面狀態(tài)。
簡而言之,每一個用戶交互是這樣別處理的,通過服務器的循環(huán)產(chǎn)生如下的結(jié)果:
產(chǎn)生一個新的頁面
產(chǎn)生一個新的URI
因為瀏覽器記錄了連續(xù)的URIs到它的歷史堆棧里,并且將當前的URI顯示在地址欄里,WEB的可用性特性就被激活。在地址欄里,用戶可以拷貝URI,并且可以把它發(fā)送給朋友。當用戶點擊返回按鈕或從email里粘貼一個URI到地址欄里,一個到服務器的循環(huán)就被觸發(fā)。由于服務器負責狀態(tài)管理,那么服務器就能產(chǎn)生相應的頁面。
AJAX應用和傳統(tǒng)的WEB應用的最大的不同在于AJAX應用能夠不通過頁面的重載而處理用戶的交互。通過XMLHttpRequest對象從服務器載入數(shù)據(jù)就是一個例子。使用java script處理客戶端drag-and-drop是另外的一個例子。
在上面的兩個例子中,狀態(tài)的變化不是通過產(chǎn)生一個新的URI得到的。因此,點擊后退按鈕或者刷新按鈕不能得到想要的效果,并且在地址欄里沒有deep-link的URI。
為了提供傳統(tǒng)的WEB可用性特性,AJAX應用需要像傳統(tǒng)的WEB應用一樣來處理URIs客戶端。因此AJAX應用需要做如下的事:
當一個客戶端狀態(tài)變化時,產(chǎn)生一個URI,并且發(fā)送到客戶端
當一個新的URI被客戶端請求時,保存狀態(tài)
做到了上面的兩點,瀏覽器的歷史紀錄將會工作,瀏覽器的地址欄將顯示一個能發(fā)送給朋友的URI。
另外一個困難是決定什么時候AJAX引擎應該做上面的那兩件事(例如,什么樣的狀態(tài)變化將導致產(chǎn)生一個新的URI)。在傳統(tǒng)的模式中,每一個頁面刷新都導致一個URI的更新。在AJAX模式中,每一個客戶端事件都可能產(chǎn)生一個URI到瀏覽器堆棧。交互設計師和開發(fā)者將決定什么樣的狀態(tài)變化是有意義的。因而只對那些有意義的狀態(tài)變化產(chǎn)生新的URI。
分享:改變我們生活的這些XML應用XHTML 2.0 做了許多擴展,增強了作者表達內(nèi)容結(jié)構和含義的能力。打破向后兼容性引起了爭議。一些評論者認為保持 (X)HTML 的名稱只修改版本號會造成混亂。 將改變我們生活的XML有關的
- 相關鏈接:
- 教程說明:
Xml教程-開發(fā)保留標準的瀏覽器功能的AJAX應用
。