背景知識：

 Http的8種請求型別：

HEAD、GET、POST、OPTION、PUT、DELETE、TRACE、CONNECT

一、常規Ajax

    <script>
        function loadXMLDoc(){
            var xhr;
            if (window.XMLHttpRequest){
                //  IE7+, Firefox, Chrome, Opera, Safari 瀏覽器執行程式碼
                xhr=new XMLHttpRequest();
            }else{
                // IE6, IE5 瀏覽器執行程式碼
                xhr=new ActiveXObject("Microsoft.XMLHTTP");
            }

            xhr.onreadystatechange=function(){
                if (xhr.readyState==4 && xhr.status==200){
                    document.getElementById("myDiv").innerHTML=xhr.responseText;
                }
            }
            xhr.open("GET","相對路徑",true);
            xhr.send();
        }
    </script>
 

 二、瀏覽器跨域傳送請求

 產生跨域的原因：瀏覽器為保護使用者資料安全而採取的同源策略（請求方與被請求方，只要協議、域名、埠不一致則報錯）

解決辦法：

1. 通過cmd禁用瀏覽器同源策略，實用性不高，不可能每個人都特地設定瀏覽器再發請求 
2. Flash外掛傳送請求，依賴Flash，基本被放棄
3. 同源域名下搭建代理伺服器轉發請求，因為伺服器 不受同源策略限制，但需額外開發伺服器端（反向代理）

４.JSONP

1. 使用絕對路徑
2. 相容性好，但只能傳送GET請求，且需要服務端配合；
3. 通過動態新增script標籤，並加入一個callback回撥函式，獲取到的資料被當作引數傳入回撥函式；

５.CORS（驗證請求型別採取不同方式）

var url = '絕對路徑';
var xhr = new XMLHttpRequest();
xhr.open('PUT', url, true);
xhr.setRequestHeader('自定義頭資訊', 'value');
xhr.send();

1. 是一個W３C標準，允許瀏覽器跨域傳送請求，需要瀏覽器和伺服器同時支援，其程式碼與AJAX完全一致；
2. 一旦瀏覽器發現發出的請求是跨域的，就會附加頭資訊，如果是非簡單請求還會附加一次預檢請求，因此關鍵在伺服器
3. 預設不傳送cookie和HTTP認證資訊，除非客戶端在Ajax請求中設定withCredentials和服務端Access-Control-Allow-Credentials都為true

簡單請求的標準：

1. 請求方法：GET、POST、HEAD
2. ＨTTP頭資訊欄位：Accept、Accept-Language、ContentType-Language、Last-Event-ID、Content-Type

實現方式：

1. 簡單請求：瀏覽器在請求頭中新增origin欄位，如果返回頭中Access-Control-Allow-Origin欄位中包含請求地址或是萬用字元＊，則同意請求，同時會在返回頭中新增Access-Control相關欄位
2. 非簡單請求：會增加一次HTTP查詢請求（OPTION），如果origin在服務端允許的範圍內才會正式傳送Ajax請求

參考：http://www.ruanyifeng.com/blog/2016/04/cors.html

https://segmentfault.com/a/1190000012469713