Ajax之readyState(狀態值)和status(狀態碼)的研究

var xhr = createXHR();
        xhr.onreadystatechange =function(){
            if (xhr.readyState==4) {
            if ((xhr.status>=200&&xhr.status<300)||xhr.status==304) {
            alert(xhr.responseText);
            }else {
            alert('Request was unsuccessful:'+xhr.status);
            }
          }
        };
        xhr.open('get','http://120.78.164.247:9999/user/findAll', false);
        xhr.send(null);

1.Ajax:readyState(狀態值)和status(狀態碼)的區別
readyState,是指運行Ajax所經歷過的幾種狀態,不管訪問是否成功都將響應的步驟,能夠理解成爲Ajax運行步驟,使用「ajax.readyState」得到。
status,是指不管Ajax訪問是否成功,由http協議根據所提交的信息,服務器所返回的http頭信息代碼,使用「ajax.status」得到。javascript

整體理解:能夠簡單的理解爲state表明一個總體的狀態。而status是這個大的state下面具體的小的狀態。java

2.什麼是readyState
readyState是XMLHttpRequest對象的一個屬性,用來標識當前XMLHttpRequest對象處於什麼狀態。
readyState總共有5個狀態值,分別爲0~4,每一個值表明了不一樣的含義。ajax

0:初始化,XMLHttpRequest對象尚未完成初始化
1:載入,XMLHttpRequest對象開始發送請求
2:載入完成,XMLHttpRequest對象的請求發送完成
3:解析,XMLHttpRequest對象開始讀取服務器的響應
4:完成,XMLHttpRequest對象讀取服務器響應結束

3.什麼是status
status是XMLHttpRequest對象的一個屬性,表示響應的http狀態碼
在http1.1協議下,http狀態碼總共可分爲5大類服務器

1xx:信息響應類,表示接收到請求而且繼續處理
2xx:處理成功響應類,表示動做被成功接收、理解和接受
3xx:重定向響應類,爲了完成指定的動做,必須接受進一步處理
4xx:客戶端錯誤,客戶請求包含語法錯誤或者是不能正確執行
5xx:服務端錯誤,服務器不能正確執行一個正確的請求
 
100——客戶必須繼續發出請求
101——客戶要求服務器根據請求轉換HTTP協議版本
200——交易成功
201——提示知道新文件的URL
202——接受和處理、但處理未完成
203——返回信息不肯定或不完整
204——請求收到,但返回信息爲空
205——服務器完成了請求,用戶代理必須復位當前已經瀏覽過的文件
206——服務器已經完成了部分用戶的GET請求
300——請求的資源可在多處獲得
301——刪除請求數據
302——在其餘地址發現了請求數據
303——建議客戶訪問其餘URL或訪問方式
304——客戶端已經執行了GET,但文件未變化
305——請求的資源必須從服務器指定的地址獲得
306——前一版本HTTP中使用的代碼,現行版本中再也不使用
307——申明請求的資源臨時性刪除
400——錯誤請求,如語法錯誤
401——請求受權失敗
402——保留有效ChargeTo頭響應
403——請求不容許
404——沒有發現文件、查詢或URl
405——用戶在Request-Line字段定義的方法不容許
406——根據用戶發送的Accept拖,請求資源不可訪問
407——相似401,用戶必須首先在代理服務器上獲得受權
408——客戶端沒有在用戶指定的餓時間內完成請求
409——對當前資源狀態,請求不能完成
410——服務器上再也不有此資源且無進一步的參考地址
411——服務器拒絕用戶定義的Content-Length屬性請求
412——一個或多個請求頭字段在當前請求中錯誤
413——請求的資源大於服務器容許的大小
414——請求的資源URL長於服務器容許的長度
415——請求資源不支持請求項目格式
416——請求中包含Range請求頭字段,在當前請求資源範圍內沒有range指示值,請求也不包含If-Range請求頭字段
417——服務器不知足請求Expect頭字段指定的指望值,若是是代理服務器,多是下一級服務器不能知足請求
500——服務器產生內部錯誤
501——服務器不支持請求的函數
502——服務器暫時不可用,有時是爲了防止發生系統過載
503——服務器過載或暫停維修
504——關口過載,服務器使用另外一個關口或服務來響應用戶,等待時間設定值較長
505——服務器不支持或拒絕支請求頭中指定的HTTP版本

思考問題:爲何onreadystatechange的函數實現要同時判斷readyState和status呢?函數

第一種思考方式:只使用readyState判斷性能

var xhr = createXHR();
        xhr.onreadystatechange =function(){
            if (xhr.readyState==4) {
            alert(xhr.responseText);
            }else {
            alert('Request was unsuccessful:'+xhr.status);
            }
        };
        xhr.open('get','http://120.78.164.247:9999/user/findAll', false);
        xhr.send(null);

服務響應出錯了,但仍是返回了信息,這並非咱們想要的結果。若是返回不是200,而是404或者500,因爲只使用readystate作判斷,它不理會放回的結果是200、404仍是500,只要響應成功返回了,就執行接下來的javascript代碼,結果將形成各類不可預料的錯誤。因此只使用readyState判斷是行不通的。代理

第二種思考方式:只使用status判斷code

var xhr = createXHR();
        xhr.onreadystatechange =function(){
            if ((xhr.status>=200&&xhr.status<300)||xhr.status==304) {
            alert(xhr.responseText);
            }else {
            alert('Request was unsuccessful:'+xhr.status);
            }
        };
        xhr.open('get','http://120.78.164.247:9999/user/findAll', false);
        xhr.send(null);

事實上,結果並不像預期那樣。響應碼確實是返回了200,可是總共彈出了3次窗口!第一次是「readyState=2」的窗口,第二次是「readyState=3」的窗口,第三次是「readyState=4」的窗口。由此,可見onreadystatechange函數的執行不是隻在readyState變爲4的時候觸發的,而是readyState(二、三、4)的每次變化都會觸發,因此就出現了前面說的那種狀況。可見,單獨使用status判斷也是行不通的。對象

5.由上面的試驗,咱們能夠知道判斷的時候readyState和status缺一不可。那麼readyState和status的前後判斷順序會不會有影響呢?咱們能夠將status調到前面先判斷。
事實上,這對於最終的結果是沒有影響的,可是中間的性能就不一樣了。由試驗咱們知道,readyState的每次變化都會觸發onreadystatechange函數,假如先判斷status,那麼每次都會多判斷一次status的狀態。雖然性能上影響甚微,不過仍是應該抱着追求極致代碼的想法,把readyState的判斷放在前面。
祝你們早日富可敵國,bye~ip

相關文章
相關標籤/搜索