前端面試(6) 通訊類

2021-09-12 04:10:03 字數 2863 閱讀 5457

同源策略:限制從乙個源載入的文件或指令碼如何與另乙個源的資源進行互動。這是乙個用於隔離潛在惡意檔案的關鍵的安全機制。

限制

//ajax的請求封裝

)//如果是get請求就設定url位址問號引數

if(method===

'get'

) xhr.

open

(method,url)

;//如果是post請求就設定請求體

var data=

null;if

(method===

'post'

) xhr.

send

(data);}

ajax

('get'

,'./get.php',,

function

(data)

)ajax

('post'

,'./post.php',,

function

(data)

)

4.1 jsonp
script 跨域請求跨域鏈結時,會返回 callback

// 視窗a(http:a.com)向跨域的視窗b(http:b.com)傳送資訊

bwindow.

postmessage

('data'

,'');

// 在視窗b中監聽

awindow.

addeventlistener

('message'

,function

(event)

,false

);4.4 websocket

websocket,即瀏覽器與web伺服器之間全雙工通訊標準。一旦web伺服器與客戶端建立了websocket協議的通訊連線,之後所有的通訊都依靠這個專用協議執行。通訊過程中,可互相傳送json、xml、html或等任意格式的資料。

主要特點

推送功能。支援由伺服器向客戶端推送資料的推送功能。這樣伺服器可直接傳送資料,而不必等待客戶端的請求;

減少通訊量。只要建立起websocket連線,就希望一直保持連線狀態。和http相比,不但每次連線時的總開銷減少,而且由於websocket的首部資訊很小,通訊量也相應減小了。

// websocket【參考資料】

var ws =

newwebsocket

('wss:');

ws.onopen

=function

(evt);

ws.onmessage

=function

(evt);

ws.onclose

=function

(evt)

5. cors
fetch就是用來實現cors通訊的

// cors【參考資料】

// url(必選),options(可選)

fetch

('/some/url/',)

.then

(function

(response)).

catch

(function

(err)

);

cors為什麼能支援跨域通訊:如果請求是跨域的,瀏覽器會攔截ajax請求,它會在http頭部中加origin。

前端面試11 通訊類

乙個域下的文件或指令碼試圖去請求另乙個域下的資源 同源 協議 網域名稱 埠 非同源的限制 cookie localstorage indexdb無法讀取 dom無法獲得 ajax 請求不能傳送 ajax 同源下的通訊方式 websocket 不受同源策略限制 cors 支援跨域通訊,也支援同源通訊 ...

前端面試日記(6)陌陌

前端小白,僅此記錄找實習的面試題,反思總結分享 面試題目 tcp是什莫,優點,為什麼是可靠的,擁塞機制,超時重傳 ip位址有什莫作用,由什麼組成,ip位址和mac位址區別,mac位址作用,dns 程序與執行緒,程序之間的通訊,執行緒之間通訊,全雙工通訊 資料庫索引使用了什麼資料結構,鍊錶的優點 co...

前端面試http協議類總結

http協議的主要特點 http方法 http的報文組成請求頭 鍵值對 服務端據此獲取客戶端的資訊 空行 分隔請求頭和請求體 請求體 通過請求體傳值 響應報文 狀態行 說明所請求的資源情況 響應頭 描述伺服器基本資訊 空行 分隔響應頭和響應體 響應體 服務端返回的資料 post和get的區別 htt...