JavaScript權威設計--跨域,XMLHttpRequest(簡要學習筆記十九)

1.跨域指的是什麼？

URL	說明	是否容許通訊
http://www.a.com/a.js http://www.a.com/b.js	同一域名下	容許
http://www.a.com/lab/a.js http://www.a.com/script/b.js	同一域名下不一樣文件夾	容許
http://www.a.com:8000/a.js http://www.a.com/b.js	同一域名，不一樣端口	不容許
http://www.a.com/a.js https://www.a.com/b.js	同一域名，不一樣協議	不容許
http://www.a.com/a.js http://70.32.92.74/b.js	域名和域名對應ip	不容許
http://www.a.com/a.js http://script.a.com/b.js	主域相同，子域不一樣	不容許
http://www.a.com/a.js http://a.com/b.js	同一域名，不一樣二級域名（同上）	不容許（cookie這種狀況下也不容許訪問）
http://www.cnblogs.com/a.js http://www.a.com/b.js	不一樣域名	不容許

 

跨域指的是域名不是ip!

以下：

　　127.0.0.1 與你在host中配置的 127.0.0.1   scan.www

　　雖然DNS解析的時候ip都是127.0.0.1，可是二者仍是屬於跨域，由於域名不一樣！

 

2.Comet與Ajax

 

3.XMLHttpRequest

除了GET與POST以外，XMLHttpRequest規範也容許第一個參數爲DELETE，HEAD,OPTIONS,PUT。

若是有請求頭的話，須要設置它。

如:POST請求須要「Content-Type」頭指定請求主題的MIME類型。

request.setRequestHeader("Content-Type","text/plain");

 

 

POST發送：

4.爲了在響應準備就緒獲得通知，必須監聽XMLHttpRequest對象上的readystatechange事件。

readyState是一個整數，它指定了HTTP請求的狀態。

 

 

 

下面是一個異步響應。

 

 

 

下面是一個同步響應：

 

 

 

5.<script>元素能夠發起跨域請求。而XMLHttpRequest API不能夠。

咱們能夠經過檢查頭文件類型來判斷響應的數據類型。

var type=request.getResponseHeader("Content-Type"); if(type.indexOf("xml")!==-1 && request.responseXML){ callback(request.responseXML); //Document對象響應
}else if(type==="application/json"){ callback(JSON.parse(request.responseText)); //JSON響應
}

 

6.multipart/form-data

當HTML表單同事包含文件上傳元素和其餘元素時，瀏覽器不能使用普通的表單編碼，

必須使用「multipart/form-data」的特殊Content-Type來用POST方法提交表單。

 

 

7.文件上傳

js:

window.onload=function(){ var a=document.getElementById("dd"); a.addEventListener("change",function(){ alert(this.files)   //返回一個FileList
    },false) }

 

 

 

8.HTTP進度事件

HTTP請求超時，觸發timeout事件

HTTP請求停止，觸發abort事件

HTTP太多重定向的網絡錯誤會阻止請求完成，觸發error事件

 

與progress事件相關的其餘三個屬性：

loaded:目前傳輸的字節數值

total:頭傳輸的數據的總體長度

lengthCopmputable：若是知道內容長度，爲true

例子：

request.onprogress=function(e){ if(e.lengthCopmputable){ progress.innerHTML=Math.round(100*e.loaded/e.total)+"%完畢！"；
 } }

 

9.CORS（跨域資源共享）

 

10.使用EventSource建立簡單聊天客戶端