這篇文章描述了一個支持AJAX應用書簽和回退按鈕的開源的javascript庫。在這個指南的最后,開發者將會得出一個甚至不是Google Maps 或者 Gmail那樣處理的AJAX的解決方案:健壯的,可用的書簽和向前向后的動作能夠象其他的web頁面一樣正確的工作。
AJAX:怎樣去控制書簽和回退按鈕 這篇文章說明了一個重要的成果,AJAX應用目前面對著書簽和回退按鈕的應用,描述了非常簡單的歷史庫(Really Simple History),一個開源的解決這類問題的框架,并提供了一些能夠運行的例子。
這篇文章描述的主要問題是雙重的,一是一個隱藏的html 表單被用作一個大而短生命周期的客戶端信息的session緩存,這個緩存對在這個頁面上前進回退是強壯的。二是一個錨連接和隱藏的iframes的組合用來截取和記錄瀏覽器的歷史事件,來實現前進和回退的按鈕。這兩個技術都被用一個簡單的javascript庫來封裝,以利于開發者的使用。
存在的問題
書簽和回退按鈕在傳統的多頁面的web應用上能順利的運行。當用戶在網站上沖浪時,他們的瀏覽器地址欄能更新URL,這些URL可以被粘貼到的email或者添加到書簽以備以后的使用?;赝撕颓斑M按鈕也可以正常運行,這可以使用戶在他們訪問的頁面間移動。
AJAX應用是與眾不同的,然而,他也是在單一web頁面上成熟的程序。瀏覽器不是為AJAX而做的—AJAX他捕獲過去的事件,當web應用在每個鼠標點擊時刷新頁面。
在象Gmail那樣的AJAX軟件里,瀏覽器的地址欄正確的停留就象用戶在選擇和改變應用的狀態時,這使得作書簽到特定的應用視圖里變得不可能。此外,如果用戶按下了他們的回退按鈕去返回上一個操作,他們會驚奇的發現瀏覽器將完全離開原來他所在的應用的web頁面。
解決方案
開源的Really Simply History(RSH)框架解決了這些問題,他帶來了AJAX應用的作書簽和控制前進后退按鈕的功能。RSH目前還是beta版,在Firefox1.0上,Netscape7及以上,和IE6及以上運行。Safari現在還不支持(要得到更詳細的說明,請看我的weblog中的文章Coding in Paradise: Safari: No DHTML History Possible).
目前存在的幾個AJAX框架可以幫助我們做書簽和發布歷史,然而所有的框架都因為他們的實現而被幾個重要的bug困擾(請看Coding in Paradise: AJAX History Libraries 得知詳情)。此外,許多AJAX歷史框架集成綁定到較大的庫上,比如Backbase 和 Dojo,這些框架提供了與傳統AJAX應用不同的編程模型,強迫開發者去采用一整套全新的方式去獲得瀏覽器的歷史相關的功能。
相應的,RSH是一個簡單的模型,能被包含在已經存在的AJAX系統中。而且,Really Simple History庫使用了一些技巧去避免影響到其他歷史框架的bug.
Really Simple History框架由2個javascript類庫組成,分別叫DhtmlHistory 和 HistoryStorage.
DhtmlHistory 類提供了一個對AJAX應用提取歷史的功能。.AJAX頁面add() 歷史事件到瀏覽器里,指定新的地址和關聯歷史數據。DhtmlHistory 類用一個錨的hash表更新瀏覽器現在的URL,比如#new-location ,然后用這個新的URL關聯歷史數據。AJAX應用注冊他們自己到歷史監聽器里,然后當用戶用前進和后退按鈕導航的時候,歷史事件被激發,提供給瀏覽器新的地址和調用add()持續保留數據。
第二個類HistoryStorage,允許開發者存儲任意大小的歷史數據。一般的頁面,當一個用戶導航到一個新的網站,瀏覽器會卸載和清除所有這個頁面的應用和javascript狀態信息。如果用戶用回退按鈕返回過來了,所有的數據已經丟失了。HistoryStorage 類解決了這個問題,他有一個api 包含簡單的hashtable方法比如put(),get(),hasKey()。這些方法允許開發者在離開web頁面時存儲任意大小的數據,當用戶點了回退按鈕返回時,數據可以通過HistoryStorage 類被訪問。我們通過一個隱藏的表單域(a hidden form field),利用瀏覽器即使在用戶離開web頁面也會自動保存表單域值的這個特性,完成這個功能。
原文轉自:http://www.anti-gravitydesign.com