1. 程式人生 > >Ajax——優缺點、互動模型、跨域問題以及對同步非同步的區分

Ajax——優缺點、互動模型、跨域問題以及對同步非同步的區分

一、Ajax優缺點

  • 優點:

1、最大的一點是頁面無重新整理,使用者的體驗非常好。

2、使用非同步方式與伺服器通訊,具有更加迅速的響應能力。

3、可以把以前一些伺服器負擔的工作轉嫁到客戶端,利用客戶端閒置的能力來處理,減輕伺服器和頻寬的負擔,節約空間和寬頻租用成本。並且減輕伺服器的負擔,ajax的原則是“按需取資料”,可以最大程度的減少冗餘請求,和響應對伺服器造成的負擔。

4、基於標準化的並被廣泛支援的技術,不需要下載外掛或者小程式。

  • 缺點

1、ajax不支援瀏覽器back按鈕。

       用AJAX做互動的時候,是通過js+xmlhttp來獲取其他頁面資訊,對於瀏覽使用者來說,是一個隱性的UE,感覺不到瀏覽器位址列的URL的變化,對瀏覽器來說,位址列的URL沒發變化,產生不了HISTORY。

       不是說在用AJAX做互動的時候,BACK按鈕的問題就解決不了,對於AJAX應用很成熟的網站比如google等,這些都已經解決。

       用過Gmail的知道,Gmail下面採用的ajax技術解決了這個問題,在Gmail下面是可以後退的,但是,它也並不能改變ajax的機制,即使用者單擊後退按鈕訪問歷史記錄時,通過建立或使用一個隱藏的IFRAME來重現頁面上的變更。(例如,當用戶在Google Maps中單擊後退時,它在一個隱藏的IFRAME中進行搜尋,然後將搜尋結果反映到Ajax元素上,以便將應用程式狀態恢復到當時的狀態。)

       但是,雖然說這個問題是可以解決的,但是它所帶來的開發成本是非常高的,和ajax框架所要求的快速開發是相背離的。這是ajax所帶來的一個非常嚴重的問題。

2、安全問題 AJAX暴露了與伺服器互動的細節。

        ajax技術就如同對企業資料建立了一個直接通道。這使得開發者在不經意間會暴露比以前更多的資料和伺服器邏輯。ajax的邏輯可以對客戶端的安全掃描技術隱藏起來,允許黑客從遠端伺服器上建立新的攻擊。還有ajax也難以避免一些已知的安全弱點,諸如跨站點腳步攻擊、SQL注入攻擊和基於credentials的安全漏洞等。

3、對搜尋引擎的支援比較弱。

4、破壞了程式的異常機制。

        像ajax.dll,ajaxpro.dll這些ajax框架是會破壞程式的異常機制的。

5、不容易除錯。

       比如說違背了url和資源定位的初衷。例如,我給你一個url地址,如果採用了ajax技術,也許你在該url地址下面看到的和我在這個url地址下看到的內容是不同的。這個和資源定位的初衷是相背離的。

6、一些手持裝置(如手機、PDA等)現在還不能很好的支援ajax。

       比如說我們在手機的瀏覽器上打開採用ajax技術的網站時,它目前是不支援的。

二、Ajax的互動模型

  • 使用者發出非同步請求;  
  • 建立 XMLHttpRequest 物件;  
  • 告訴 XMLHttpRequest 物件哪個函式會處理XMLHttpRequest 物件狀態的改變,為此要把物件的onReadyStateChange 屬性設定為響應該事件的 JavaScript 函式的引用;
  • 建立請求,用 open 方法指定是 get 還是 post ,是否非同步, url 地址;  
  • 傳送請求, send 方法  
  • 接收結果並分析  
  • 實現重新整理

三、Ajax的跨域問題

              預設情況下,XHR物件只能訪問與包含它的頁面位於同一個域中的資源,這種安全策略可以預防某些惡意行為。
        實現合理的跨域請求對開發某些瀏覽器應用程式至關重要。
        主要有以下幾種方法:
  • CORS,跨域資源共享,定義了必須在訪問跨域資源時,瀏覽覽器與伺服器該如何溝通,基本思想是,使用自定義的HTTP頭部讓瀏覽器與伺服器進行溝通,從而決定請求或響應是否成功。注意,請求和響應都不包含cookie資訊。IE8通過XDomainRequest物件支援CORS,其它瀏覽器通過XHR物件原生支援CORS。
  • 影象Ping,多用於動態建立影象。該方式與伺服器進行簡單、單向的跨域通訊。
       它有兩個主要缺點,一是隻能傳送GET請求,二是無法訪問伺服器的響應文字。
  • JSONP,填充式JSON,應用JSON的一種新方法。

       它是被包含在函式呼叫中的JSON,例如,

             callback({“name”: “abc”});

       JSONP由兩部分組成,毀掉函式和資料。毀掉函式是當響應到來時應該在頁面中呼叫的函式。資料時傳入毀掉函式中的JSON資料。
  • Comet,是一種伺服器向頁面推送資料的技術。兩種方式可實現,長輪詢和流。
  • SSE,伺服器傳送事件。SSE API用於建立到伺服器的單向連線,伺服器通過這個連線可以傳送任意數量的資料。
  • Web Sockets API

四、同步與非同步的區別

       同步:指令碼會停留並等待伺服器傳送回覆然後再繼續

       非同步:指令碼允許頁面繼續其程序並處理可能的回覆

       AJAX使用的是非同步,傳統的Web是使用的同步。 同步更新是需要對整個頁面進行更新,並且以新頁面的形式顯示出來。因為伺服器每次都會返回一個新的頁面,所以傳統的web應用有可能很慢而且使用者互動不友好。 \

        非同步更新是後臺和伺服器進行少量資料交換,即不重新載入整個網頁就可以對網頁的某部分進行更新。而AJAX減少了使用者的等待時間。展示給使用者的還是同一個頁面,使用者感覺頁面重新整理,也看不到到Javascript後臺進行的傳送請求和接受響應。


\

部分內容參考下面網頁內容:
http://www.cnblogs.com/ustbwuyi/archive/2007/02/08/645061.html#2215165
http://www.2cto.com/kf/201504/395028.html