摘要：跨域源資源共享同源域名端口協(xié)議均相同基本思想是使用自定義的頭部，讓服務(wù)器能聲明允許訪問(wèn)的來(lái)源。簡(jiǎn)單請(qǐng)求所有的跨域請(qǐng)求簡(jiǎn)單或非簡(jiǎn)單總會(huì)包含一個(gè)的請(qǐng)求頭部由瀏覽器添加不受用戶控制。

同源：域名、端口、協(xié)議均相同
CORS基本思想是使用自定義的HTTP頭部，讓服務(wù)器能聲明允許訪問(wèn)的來(lái)源。
使用CORS時(shí)，異步請(qǐng)求會(huì)被分為簡(jiǎn)單請(qǐng)求(非Preflight)和非簡(jiǎn)單請(qǐng)求。

所有的跨域請(qǐng)求(簡(jiǎn)單或非簡(jiǎn)單)總會(huì)包含一個(gè)origin的請(qǐng)求頭部,由瀏覽器添加不受用戶控制。值由協(xié)議、域名、端口組成,說(shuō)明請(qǐng)求的來(lái)源。下面為一個(gè)Origin頭部示例:

Origin:http://www.hello.com

服務(wù)器接受這個(gè)請(qǐng)求,會(huì)在響應(yīng)頭Access-Control-Allow-Origin回發(fā)相同的源信息。( * 表明該資源可以被任意外域訪問(wèn))

Access-Control-Allow-Origin:http://www.hello.com

非簡(jiǎn)單CORS請(qǐng)求會(huì)在正式請(qǐng)求之前發(fā)送一次Preflight請(qǐng)求,得到確認(rèn)之后才會(huì)發(fā)送真正的XMLHttpRequest請(qǐng)求。瀏覽器自動(dòng)處理這兩個(gè)請(qǐng)求,并且Preflight請(qǐng)求結(jié)束后,結(jié)果將按照響應(yīng)中指定的時(shí)間緩存起來(lái).所以只是第一次發(fā)送這種請(qǐng)求時(shí)會(huì)多一次HTTP請(qǐng)求.
Preflight請(qǐng)求使用OPTIONS方法,發(fā)送下列頭部:

Origin:與簡(jiǎn)單請(qǐng)求相同
Access-Control-Request-Method:請(qǐng)求自身使用的方法

以下是一個(gè)帶有自定義頭部Custom-Header的使用POST方法發(fā)送的請(qǐng)求.

Origin:http://www.hello.com
Access-Control-Request-Method:POST
Access-Control-Request-Headers:Custom-Header

var url = "http://www.hello.com";
var xhr = new XMLHttpRequest();
xhr.open("POST", url, true);
xhr.setRequestHeader("Custom-Header", "value");
xhr.send();

服務(wù)器通過(guò)在響應(yīng)中發(fā)送如下頭部與瀏覽器溝通:

Access-Control-Allow-Origin:http://www.hello.com
Access-Control-Allow-Methods:POST,GET
Access-Control-Allow-Headers:Custom-Header
Access-Control-Allow-Max-Age:28000  //表示將Preflight緩存的時(shí)長(zhǎng)(秒),期間內(nèi)無(wú)需再次發(fā)送預(yù)請(qǐng)求

另外通過(guò)將XMLHttpRequest的withCredentials屬性設(shè)置為true就可以發(fā)送帶憑據(jù)(cookie、HTTP認(rèn)證、客戶端SSL證明等)的跨域請(qǐng)求.

var xhr=new XMLHttpRequest();
xhr.withCredentials=true;

如果服務(wù)器接受帶憑據(jù)的請(qǐng)求會(huì)用下面的HTTP頭部響應(yīng):

Access-Control-Allow-Credentials:true

JSONP由兩部分組成:回調(diào)函數(shù)+數(shù)據(jù),回調(diào)函數(shù)是當(dāng)響應(yīng)到來(lái)時(shí)應(yīng)該在頁(yè)面中調(diào)用的函數(shù),回調(diào)函數(shù)的名字一般是在請(qǐng)求中指定的.而數(shù)據(jù)就是傳入回調(diào)函數(shù)中的JSON數(shù)據(jù).JSONP是通過(guò)動(dòng)態(tài)