一晃又到新年了，於是開始着手好好整理下自己的文檔，順便把一些自認為有意義的放在博客上，記錄成點的點滴。
跨域是我在日常面試中經常會問到的問題，這詞在前端界出現的頻率不低，主要原因還是由於安全限制(同源策略， 即JavaScript或Cookie只能訪問同域下的內容)，因為我們在日常的項目開發時會不可避免的需要進行跨域操作，所以跨域能力也算是前端工程師的基本功之一。
和大多數跨域的解決方案一樣，JSONP也是我的選擇，可是某天PM的需求變了，某功能需要改成支持POST，因為傳輸的數據量比較大，GET形式搞不定。所以折騰了下聞名已久的
CORS（跨域資源共享，Cross-Origin Resource Sharing
），這邊文章也就是折騰期間的小記與總結。
概述
- CORS能做什么：
正常使用AJAX會需要正常考慮跨域問題，所以偉大的程序員們又折騰出了一系列跨域問題的解決方案，如JSONP、flash、ifame、xhr2等等。
本文介紹的CORS就是一套AJAX跨域問題的解決方案。
- CORS的原理：
CORS定義一種跨域訪問的機制，可以讓AJAX實現跨域訪問。CORS 允許一個域上的網絡應用向另一個域提交跨域 AJAX 請求。實現此功能非常簡單，只需由服務器發送一個響應標頭即可。
- CORS瀏覽器支持情況如下圖：
喜聞樂見、普大喜奔的支持情況，尤其是在
移動終端上，除了opera Mini；
PC上的現代瀏覽器都能友好的支持，除了IE9-，不過前端工程師對這種情況早應該習慣了...
CORS啟航
假設我們頁面或者應用已在
http://www.test1.com 上了，而我們打算從
http://www.test2.com 請求提取數據。一般情況下，如果我們直接使用 AJAX 來請求將會失敗，瀏覽器也會返回“源不匹配”的錯誤，"
跨域"也就以此由來。
利用 CORS，
http://www.test2.com 只需添加一個標頭，就可以允許來自
http://www.test1.com 的請求，下圖是我在PHP中的 hander() 設置，
“*”號表示允許任何域向我們的服務端提交請求：
當前我設置的header為“*”，任意一個請求過來之后服務端我們都可以進行處理&響應，那么在調試工具中可以看到其頭信息設置，其中見紅框中有一項信息是“
Access-Control-Allow-Origin：* ”，表示我們已經啟用CORS，如下圖。
PS：
由於demo都在我廠的兩台測試機間完成，外網也不能訪問，所以在這就不提供demo了，見諒
簡單的一個header設置，一個支持跨域&POST請求的server就完成了:)
當然，如果沒有開啟CORS必定失敗的啦，如下圖：
問題&小結
- 剛剛說到的兼容性。CORS是W3C中一項較新的方案，所以部分瀏覽器還沒有對其進行支持或者完美支持，詳情可移至 http://www.w3.org/TR/cors/
- 安全問題。CORS提供了一種跨域請求方案，但沒有為安全訪問提供足夠的保障機制，如果你需要信息的絕對安全，不要依賴CORS當中的權限制度，應當使用更多其它的措施來保障，比如OAuth2。
自認為的cors使用場景：
- cors在移動終端支持的不錯，可以考慮在移動端全面嘗試；PC上有不兼容和沒有完美支持，所以小心踩坑。當然瀏覽器兼容就是個偽命題，說不准某個瀏覽器的某個版本就完美兼容了，說不准就有點小坑，尼瑪傷不起！～
- jsonp是get形式，承載的信息量有限，所以信息量較大時CORS是不二選擇；
- 配合新的JSAPI(fileapi、xhr2等)一起使用，實現強大的新體驗功能。
如果覺得這文章也算用心，請勞駕點右下角的推薦。
祝2014順利。
最后，有 北京&上海 的朋友想春節后想換工作的，【百度移動雲事業部】期待聰明、勤奮的你 與我聯系 (JD在頁面右上角)
參考資料: