小男孩‘自慰网亚洲一区二区,亚洲一级在线播放毛片,亚洲中文字幕av每天更新,黄aⅴ永久免费无码,91成人午夜在线精品,色网站免费在线观看,亚洲欧洲wwwww在线观看

分享

Thinking in AJAX(二) —— 基于AJAX的WEB設(shè)計

 IT-man 2005-08-14

Thinking in AJAX(二) —— 基于AJAX的WEB設(shè)計

摘要:

一、AJAX最值得稱贊的是異步交互,而不是無刷新

很多人都看好AJAX無刷新的技術(shù),以至于認同AJAX就是用來做無刷新的。這個認識是錯誤的,什么是無刷新?無刷新就是頁面無需重載,那什么又是異步交互?異步交互就是一個簡單的多線程,當你在一個blog里看文章時,同時也可以利用AJAX進行無刷新的回復(fù)提交,看起來雖然也是無刷新,但這里最重要的是異步,即你能一邊看文章,一邊又能向服務(wù)器提交你的回復(fù)信息,利用好這個異步,才能算是掌握了AJAX的精髓。很多場合,無刷新是呈現(xiàn)給用戶的視覺體驗,而異步交互卻是默默無聞的工作在臺后,這種情況導(dǎo)致大多數(shù)人的錯誤理解了AJAX的權(quán)重之分。

二、推薦在WEB上輕量級的應(yīng)用AJAX



著名的圖片存儲網(wǎng)站Flickr利用AJAX可謂出神入化。我之所以這么說,是因為我認為Flickr深知AJAX的利與弊,并且牢牢抓住自己的網(wǎng)站的功能特點,并沒有因AJAX而AJAX,而是架驅(qū)于技術(shù)至上,讓AJAX融于網(wǎng)站之中,為網(wǎng)站提供了更好的功能服務(wù)。如Flickr中無論是在多圖列表頁面還是單圖詳細頁面,修改圖片的標題和描述都應(yīng)用了AJAX技術(shù),讓用戶無需跳轉(zhuǎn)到單獨的編輯頁面中,編輯后單擊保存,亦使用了異步交互的方式進行數(shù)據(jù)提交,這時,頁面上顯示一個Loading字符外,其他部分不受任何影響,可謂太貼心的服務(wù)。

再如基于Tag的專業(yè)Blog搜索服務(wù)商Technorati也使用了AJAX,在搜索某個Tag時,頁面主導(dǎo)部分會即刻顯示所有Technorati數(shù)據(jù)庫中查詢到的數(shù)據(jù)條目,在左邊的側(cè)邊欄上會顯示兩個Loading圖標,過一會兒,這兩個Loading就會顯示具體的內(nèi)容了,顯示的是此Tag相關(guān)的Flickr的圖片和書簽服務(wù)網(wǎng)站(Furl&del.icio.us)的鏈接,因為這兩部分內(nèi)容是取自其他網(wǎng)站,如果由服務(wù)器統(tǒng)一先取得數(shù)據(jù)在一同顯示到頁面時,會受到網(wǎng)速影響而變慢,通過AJAX的異步交互方式首先立即顯示本地數(shù)據(jù),然后由客戶端去和Flickr、Furl、del.icio.us打交道分別取得它們的數(shù)據(jù),即節(jié)約了流量帶寬又不影響用戶訪問速度,可謂高明。

通過以上兩個國外成功應(yīng)用AJAX的網(wǎng)站,我們發(fā)現(xiàn)他們都使用的是輕量級的AJAX,就是那種交互簡單,數(shù)據(jù)較少的操作。這也符合AJAX的本意,雖然像www.bindows都在RIA上有驚人的表現(xiàn)能力,但是速度慢、搜索引擎支持不好、開發(fā)難度大等毛病還是無法讓用戶滿意的,請記?。篈JAX的最終目的是為了提高用戶體驗,為了方便用戶交互,而不是因技術(shù)而技術(shù)的。

三、AJAX的MVC架構(gòu)設(shè)計

很多人認為在成熟的框架中應(yīng)用AJAX會破壞框架的完整性,比較常見的說法有三層架構(gòu)的WEB應(yīng)用中破壞MVC模式,其實不然。MVC的理論我就不多說了,經(jīng)典的那三個層、五條線大家都很熟悉,在WEB應(yīng)用中,因為瀏覽器/服務(wù)器固有的這種請求/響應(yīng)的斷開式網(wǎng)絡(luò)通訊模式,決定了在Model層無法實現(xiàn)主動向View層發(fā)出數(shù)據(jù)更新事件,所以一般常見的成熟MVC框架中都將經(jīng)典MVC理論稍作修改:由Model層處理完業(yè)務(wù)后通知Control層,然后由Control層承擔向View發(fā)送數(shù)據(jù)更新的義務(wù)。但是AJAX天生具有監(jiān)聽功能,AJAX實現(xiàn)異步響應(yīng)的那個OnReadyStateChange事件就具有在客戶端程序中才會有的事件監(jiān)聽功能?,F(xiàn)在想來,利用AJAX實現(xiàn)的MVC模型有如下圖這樣:

理想化的設(shè)計如下所示:

  • 三層對應(yīng)的文件對象:view.jsp(視圖)、action.do(控制器)、model.java(模型)
  • view.jsp是用戶看到的界面,并通過內(nèi)置的AJAX對象異步方式給action.do發(fā)送請求,AJAX.OnReadyStateChange開始監(jiān)聽
  • action.do接收到view.jsp發(fā)過來的請求(GET或者POST方式),通過Request判斷后發(fā)送給相應(yīng)的業(yè)務(wù)/數(shù)據(jù)模型model.java
  • model.java開始執(zhí)行業(yè)務(wù)操作,執(zhí)行完畢直接給view.jsp頁面發(fā)送數(shù)據(jù)更新的通知,這個通知的消息有可能是XML封裝的數(shù)據(jù),也有可能是一段文本,甚至是一段HTML代碼,當然,既然用MVC,不推薦有Model發(fā)送HTML,推薦還是用XML封裝業(yè)務(wù)數(shù)據(jù)即可。
  • view.jsp頁面中AJAX對象的OnReadyStateChange接收到了數(shù)據(jù)更新通知,根據(jù)實際情況用DOM進行頁面呈現(xiàn)更新。
通過以上幾步一氣呵成,一個典型的基于MVC的三層交互就完成了。當然,熟悉WEB下的MVC框架的用戶,如熟悉Struts的Java開發(fā)人員可能不習慣由Model層給View直接發(fā)送數(shù)據(jù)更新通知,那咱們也可以轉(zhuǎn)變一下,Model層業(yè)務(wù)處理完畢將更新通知先發(fā)送給Control,由Control去通知View亦可。

注:全文完

    本站是提供個人知識管理的網(wǎng)絡(luò)存儲空間,所有內(nèi)容均由用戶發(fā)布,不代表本站觀點。請注意甄別內(nèi)容中的聯(lián)系方式、誘導(dǎo)購買等信息,謹防詐騙。如發(fā)現(xiàn)有害或侵權(quán)內(nèi)容,請點擊一鍵舉報。
    轉(zhuǎn)藏 分享 獻花(0

    0條評論

    發(fā)表

    請遵守用戶 評論公約

    類似文章 更多