瀏覽器只允許請求當前域的資源，而對其他域的資源表示不信任。那怎么才算跨域呢？
- 請求協議
http,https的不同 - 域
domain的不同 - 端口
port的不同
好好好，大概就是這么回事啦，下面我們講2種中規中矩的辦法：CORS，JSONP
document.domain，window.name，web sockets就先別鬧了，腰不好 : )
2、CORS
這是W3C的標准，全稱是"跨域資源共享"（Cross-origin resource sharing）。我們先來看看整個流程
在此之前，需要知道簡單請求 復雜請求這兩個小朋友
- 簡單請求：
1): 請求方式只能是：head，get，post
2): 請求頭允許的字段：Accept，Accept-Language，Content-Language，Last-Event-IDContent-Type：application/x-www-form-urlencoded、multipart/form-data、text/plain 三選一
2.復雜請求：沒錯，不滿足上面的，都是我啦！
簡單請求:
瀏覽器：誒，你小子要跨域是吧，我得問問服務器大哥肯不肯！往請求頭添加origin亮一下牌面
有個奇怪現象，谷歌游覽器在非跨域情況下，也會發送origin字段
服務器：誒，你是誰，我來看看你的origin，嗯嗯，可以，符合我的要求，放行！順便告訴你，老夫的規矩！
其中，最重要的就是
Access-Control-Allow-Origin，標識允許哪個域的請求。當然，如果服務器不通過，根本沒有這個字段，接着觸發
XHR的
onerror，再接着你就看到瀏覽器的提示
xxx的服務器沒有響應Access-Control-Allow-Origin字段
//指定允許其他域名訪問 'Access-Control-Allow-Origin:http://172.20.0.206'//一般用法（*，指定域，動態設置），3是因為*不允許攜帶認證頭和cookies //是否允許后續請求攜帶認證信息（cookies）,該值只能是true,否則不返回 'Access-Control-Allow-Credentials:true' 上面第一行說到的Access-Control-Allow-Origin有多種設置方法：
- 設置
*是最簡單粗暴的，但是服務器出於安全考慮，肯定不會這么干，而且，如果是*的話，游覽器將不會發送cookies，即使你的XHR設置了withCredentials - 指定域，如上圖中的
http://172.20.0.206，一般的系統中間都有一個nginx，所以推薦這種 - 動態設置為請求域，多人協作時，多個前端對接一個后台，這樣很方便
withCredentials：表示XHR是否接收cookies和發送cookies，也就是說如果該值是false，響應頭的Set-Cookie，瀏覽器也不會理，並且即使有目標站點的cookies，瀏覽器也不會發送。
復雜請求:
最常見的情況，當我們使用put和delete請求時，瀏覽器會先發送option（預檢）請求，不過有時候，你會發現並沒有，這是后面我們會講到緩存。
預檢請求
與簡單請求不同的是，option請求多了2個字段：Access-Control-Request-Method：該次請求的請求方式Access-Control-Request-Headers：該次請求的自定義請求頭字段
服務器檢查通過后，做出響應：
//指定允許其他域名訪問 'Access-Control-Allow-Origin:http://172.20.0.206'//一般用法（*，指定域，動態設置），3是因為*不允許攜帶認證頭和cookies //是否允許后續請求攜帶認證信息（cookies）,該值只能是true,否則不返回 'Access-Control-Allow-Credentials:true' //預檢結果緩存時間,也就是上面說到的緩存啦 'Access-Control-Max-Age: 1800' //允許的請求類型 'Access-Control-Allow-Methods:GET,POST,PUT,POST' //允許的請求頭字段 'Access-Control-Allow-Headers:x-requested-with,content-type' 這里有個注意點：Access-Control-Request-Method，Access-Control-Request-Headers返回的是滿足服務器要求的所有請求方式，請求頭，不限於該次請求，我一次性告訴你了，別TM問我了
3、JSONP
好啦，jsonp的原理：通過script標簽引入一個js文件，這個js文件載入成功后會執行我們在url參數中指定的函數，並且會把我們需要的json數據作為參數傳入，有種回調的味道！
例子：
<script src="http://example.com/data.php?callback=dosomething"></script> <script type="text/javascript"> function dosomething(jsondata){ //處理獲得的json數據 } </script> jquery用法
<script type="text/javascript"> $.getJSON('http://example.com/data.php?callback=?,function(jsondata)'){ //處理獲得的json數據 }; </script> JSONP的優缺點
優點：它不像XMLHttpRequest對象實現的Ajax請求那樣受到同源策略的限制；它的兼容性更好，在更加古老的瀏覽器中都可以運行，不需要XMLHttpRequest或ActiveX的支持；並且在請求完畢后可以通過調用callback的方式回傳結果。
缺點：它只支持GET請求而不支持POST等其它類型的HTTP請求；它只支持跨域HTTP請求這種情況，不能解決不同域的兩個頁面之間如何進行JavaScript調用的問題。