基本概念部分（一）：理解CORS
說(shuō)道Vue的跨域AJAX，我想先梳理一遍CORS跨域，"跨域資源共享"（Cross-origin resource sharing），它是一個(gè)W3C標(biāo)準(zhǔn)。
CORS跨域的特點(diǎn)：它需要服務(wù)器的‘配合’。就是說(shuō)，它的實(shí)現(xiàn)是：瀏覽器（所有瀏覽器和IE10+）+服務(wù)器。
一般情況下，我們可以在請(qǐng)求頭信息中加入Origin，來(lái)告知服務(wù)器自己來(lái)自哪個(gè)源：協(xié)議 + 域名 + 端口。如果Origin域名在指定許可范圍內(nèi)，則服務(wù)器的響應(yīng)頭會(huì)多出三個(gè)信息：
Access-Control-Allow-Origin: //它的值，可以使一個(gè) *，表示接受所有域名的請(qǐng)求；還可以是指定的一個(gè)域名（在請(qǐng)求時(shí)就已經(jīng)寫好的那個(gè)origin域名）。Access-Control-Allow-Credentials: //它的值為：true。他表示是否允許發(fā)送cookie，因?yàn)閏ookie不包含在CORS中，只有其值設(shè)為true時(shí)，可以讓Cookie包含在請(qǐng)求中一起發(fā)給服務(wù)器。Access-Control-Expose-Headers: //他表示XMLHttpRequest對(duì)象的getResponseHeader()方法的六個(gè)基本字段：Cache-Control、Content-Language、Content-Type、Expires、Last-Modified、Pragma。（這里我用的最多的是Content-Type）
這里有一個(gè)withCredentials屬性需要我們知道。
因?yàn)镃ORS請(qǐng)求默認(rèn)不發(fā)送Cookie和HTTP認(rèn)證信息，因此需要 Access-Control-Allow-Credentials：true; 并且專門設(shè)置AJAX請(qǐng)求：（這里在Vue中有應(yīng)用，下面會(huì)說(shuō)）
var xhr = new XMLHttpRequest(); xhr.withCredentials = true;
這樣才可以讓瀏覽器同意發(fā)送Cookie，配合服務(wù)器的需求和配置。
CORS還有一種情況是發(fā)送“預(yù)檢請(qǐng)求”。他會(huì)在正真的數(shù)據(jù)請(qǐng)求之前，先發(fā)送一次HTTP請(qǐng)求。瀏覽器會(huì)先詢問(wèn)服務(wù)器自己的域名是否被許可，以及一些必要的頭部字段信息。服務(wù)器進(jìn)行回復(fù)后，瀏覽器再發(fā)送一次，這次是正式的 XMLHttpRequest 請(qǐng)求。
這里面說(shuō)到的“預(yù)檢”請(qǐng)求的方法為options方法，表示說(shuō)：“我是來(lái)詢問(wèn)的”。因此當(dāng)我們?cè)贑hrome的開(kāi)發(fā)者工具中會(huì)看到這個(gè)一串請(qǐng)求行：
延伸閱讀
- ssh框架 2016-09-30
- 阿里移動(dòng)安全 [無(wú)線安全]玩轉(zhuǎn)無(wú)線電——不安全的藍(lán)牙鎖 2017-07-26
- 消息隊(duì)列NetMQ 原理分析4-Socket、Session、Option和Pipe 2024-03-26
- Selective Search for Object Recognition 論文筆記【圖片目標(biāo)分割】 2017-07-26
- 詞向量-LRWE模型-更好地識(shí)別反義詞同義詞 2017-07-26
- 從棧不平衡問(wèn)題 理解 calling convention 2017-07-26
- php imagemagick 處理 圖片剪切、壓縮、合并、插入文本、背景色透明 2017-07-26
- Swift實(shí)現(xiàn)JSON轉(zhuǎn)Model - HandyJSON使用講解 2017-07-26
- 阿里移動(dòng)安全 Android端惡意鎖屏勒索應(yīng)用分析 2017-07-26
- 集合結(jié)合數(shù)據(jù)結(jié)構(gòu)來(lái)看看(二) 2017-07-26
學(xué)習(xí)是年輕人改變自己的最好方式