1. 在發(fā)送XHR請求的同時屡谐,還會發(fā)送以下頭部信息:
① Accept:瀏覽器能夠處理的內(nèi)容類型
② Accept-Charset:瀏覽器能夠顯示的字符集
③ Accept-Encoding:瀏覽器能夠處理的壓縮編碼
④ Accept-Language:瀏覽器當(dāng)前設(shè)置的語言
⑤ Connection:瀏覽器與服務(wù)器之間連接的類型
⑥ Cookie:當(dāng)前頁面設(shè)置的任何Cookie
⑦ Host:發(fā)出請求的頁面所在的域
⑧ Referer:發(fā)出請求的頁面的URI
⑨ User-Agent:瀏覽器的用戶代理字符串
2. GET請求的查詢字符串中每個參數(shù)的名稱和值都必須使用encodeURIComponent()進行編碼尸曼,然后才能放到URL的末尾凑耻;并且所有名-值對都必須由和號(&)分隔
3. XMLHttpRequest 2級中定義了FormData類型稚疹,用于序列化表單以及創(chuàng)建與表單格式相同的數(shù)據(jù)香拉。
4. 微軟在IE8中引入了XDR(XDomainRequest)類型,這個對象與XHR類似濒翻,但是能實現(xiàn)安全可靠的跨域通信屁柏。XDR與XHR相比的的不同之處:
① XDR的cookie不會隨請求發(fā)送,也不會隨請求返回有送。?
② XDR只能設(shè)置請求頭部信息中的Content-Type字段.
③ XDR不能訪問響應(yīng)頭部信息
④ XDR只支持GET請求和POST請求
XDR的這些變化使CSRF(Cross-Site Request Forgery淌喻,跨站點請求偽造)和XSS(Cross-Site Scripting,跨站點腳本)的問題得到了緩解雀摘。
5. 跨域XHR對象為了安全所做的限制:
① 不能使用setRequestHeader()設(shè)置自定義頭部裸删;
② 不能發(fā)送和接收cookie
③ 調(diào)用getAllResponseHeaders()方法總會返回空字符串
6. 檢測XHR是否支持CORS(Cross-Origin Resource Sharing,跨源資源共享)的最簡單方式阵赠,就是檢查是否存在withCredentials屬性涯塔,同時結(jié)合檢測XDomainRequest對象是否存在。
7. 其他跨域技術(shù):
① 圖像Ping:與服務(wù)器進行簡單清蚀、單向的跨域通信的一種方式匕荸。請求的數(shù)據(jù)通過查詢字符串形式發(fā)送,而響應(yīng)式任意內(nèi)容枷邪。瀏覽器得不到任何具體的數(shù)據(jù)榛搔,但通過監(jiān)聽load和error事件判斷服務(wù)器何時接收到請求。
? ? 其最常用于跟蹤用戶點擊頁面或動態(tài)廣告曝光次數(shù)东揣。
? ? 兩個主要缺點:一是智能發(fā)送GET請求践惑,而是無法訪問服務(wù)器的響應(yīng)文本。
② JSONP:包括回調(diào)函數(shù)和數(shù)據(jù)兩個部分嘶卧。
? ? 兩個主要缺點:一是如果JSONP加載代碼的來源域不安全童本,很可能會在響應(yīng)中夾雜一些惡意代碼,此時只能完全放棄JSONP調(diào)用脸候;二是要確定JSONP請求是否失敗并不容易。
③Comet:是一種服務(wù)器向頁面推送數(shù)據(jù)的技術(shù)绑蔫。有長輪詢和HTTP流這兩種方式實現(xiàn)运沦。
? ? 長輪詢:瀏覽器在接收數(shù)據(jù)之前,先發(fā)起對服務(wù)器的連接配深,使用XHR對象和setTimeout()就能實現(xiàn)携添;
? ? HTTP流:瀏覽器想服務(wù)器發(fā)送一個請求,而服務(wù)器保持連接打開篓叶,然后周期性地向瀏覽器發(fā)送數(shù)據(jù)烈掠。?
④ SSE:SSE(Server-Sent Events,服務(wù)器發(fā)送事件)是圍繞只讀Comet交互推出的API或者模式羞秤。SSE API用于創(chuàng)建到服務(wù)器的單向連接,服務(wù)器響應(yīng)的MIME類型必須是text/event-stream
⑤ Web Socket:在JavaScript中創(chuàng)建Web Socket后左敌,會有一個HTTP請求發(fā)送到瀏覽器以發(fā)起連接瘾蛋。在取得服務(wù)器響應(yīng)后,建立的連接會使用HTTP升級從HTTP協(xié)議交換為Web Socket協(xié)議矫限。
8. 創(chuàng)建Web Socket步驟:
① 實例一個WebSocket對象并傳入要連接的URL(絕對URL):
var socket = new WebSocket("ws://www. example.com/server. php");
② 發(fā)送數(shù)據(jù)(只能發(fā)送純文本數(shù)據(jù)):
socket.send("Hello WebSocket");
③ 接收數(shù)據(jù)哺哼,當(dāng)服務(wù)器向客戶端發(fā)來消息時,WebSocket對象就會觸發(fā)message事件(返回的數(shù)據(jù)保存在event.data屬性中):
socket. onmessage = function (event){
? ? ? ? var data = event. data;
}
④ open事件叼风,在成功建立連接時觸發(fā):
socket. onopen = function(){
? ? ? ? console.log("此時連接已經(jīng)成功建立");
}
⑤ error事件取董,在發(fā)生錯誤時觸發(fā),連接不能持續(xù):
socket. onerror = function(){
? ? ? ? console.log("連接發(fā)生錯誤无宿,快看看什么問題");
}
⑥ close事件茵汰,在連接關(guān)閉時觸發(fā):
socket. onclose = function(event){
? ? ? ? console.log(event. wasClean); ? ?// wasClean是個布爾值,表示連接是否已經(jīng)明確地關(guān)閉
? ? ? ? console.log(event. code); ? ? ? ? ? ?// code是服務(wù)器返回的數(shù)值狀態(tài)碼
? ? ? ? console.log(event. reason);// reason是個字符串孽鸡,包含服務(wù)器返回的消息
}