提起瀏覽器的同源策略,你們都很熟悉。不一樣域的客戶端腳本不能讀寫對方的資源。可是實踐中有一些場景須要跨域的讀寫,因此出現了一些hack的方式來跨域。但這些方式都存在缺陷,沒法完美的實現跨域讀寫。因此在XMLHttpRequest v2標準下,提出了CORS(Cross Origin Resourse-Sharing)的模型,試圖提供安全方便的跨域讀寫資源。web
1、背景跨域
提起瀏覽器的同源策略,你們都很熟悉。不一樣域的客戶端腳本不能讀寫對方的資源。可是實踐中有一些場景須要跨域的讀寫,因此出現了一些hack的方式來跨域。好比在同域內作一個代理,JSON-P等。但這些方式都存在缺陷,沒法完美的實現跨域讀寫。因此在XMLHttpRequest v2標準下,提出了CORS(Cross Origin Resourse-Sharing)的模型,試圖提供安全方便的跨域讀寫資源。目前主流瀏覽器均支持CORS。瀏覽器
2、技術原理安全
CORS定義了兩種跨域請求,簡單跨域請求和非簡單跨域請求。當一個跨域請求發送簡單跨域請求包括:請求方法爲HEAD,GET,POST;請求頭只有4個字段,Accept,Accept-Language,Content-Language,Last-Event-ID;若是設置了Content-Type,則其值只能是application/x-www-form-urlencoded,multipart/form-data,text/plain。提及來比較彆扭,簡單的意思就是設置了一個白名單,符合這個條件的纔是簡單請求。其餘不符合的都是非簡單請求。 服務器
之因此有這個分類是由於瀏覽器對簡單請求和非簡單請求的處理機制是不同的。當咱們須要發送一個跨域請求的時候,瀏覽器會首先檢查這個請求,若是它符合上面所述的簡單跨域請求,瀏覽器就會馬上發送這個請求。若是瀏覽器檢查以後發現這是一個非簡單請求,好比請求頭含有X-Forwarded-For字段。這時候瀏覽器不會立刻發送這個請求,而是有一個preflight,跟服務器驗證的過程。瀏覽器先發送一個options方法的預檢請求。下圖是一個示例。若是預檢經過,則發送這個請求,不然就不拒絕發送這個跨域請求。app