AJAX跨域請求數據

因爲瀏覽器的同源策略 ajax請求不能夠接收到請求響應回來的數據  

　　請求數據須要調用瀏覽器的內置構造函數 XMLHttpRequest() 進行 實例對象 

　　var xhr = new XMLHttpRequest();

　　注意點 在IE8以前支持的 ActiveXobject("Microsoft.XMLHTTP");  記住要進行兼容處理哦  在這裏我就不寫了

　　經過該對象進行獲取

　　獲取數據的四種狀態  xhr.readyState 該屬性保存着請求數據的幾種狀態

　　　　1.xhr.open(請求方式，請求地址，設置同/異步);

　　　　2.xhr.send(null);//發送請求  若是是post請求 那麼參數須要在send中進行傳遞

　　　　3.會一直檢測數據是否返回

　　　　4.數據返回 那麼xhr.readyState的值是4  說明數據返回成功

那麼咱們須要進行跨域請求如何作呢

方案一：

　　利用script標籤的src屬性請求數據  src屬性請求的數據瀏覽器是不會進行攔截的

　　<script srrc="http://jiang.com/AJAX/data.php"><script/>

　　這樣咱們是能夠請求到數據的  可是這樣有一些缺點

　　1.咱們沒法控制什麼時候發送請求的  頁面加載到這裏就是發送請求的

　　2.這樣的方式  請求方式是同步的請求 須要請求到數據纔會執行下一步的代碼  這樣頁面加載時間可能延長

　　3.因此建議不要使用這樣的方式 不推薦

方案二：

　　在js中動態建立script標籤 指定請求的接口

　　var script = document.createELement("script");

　　//將script追加到head標籤中

　　document.getElementsTagName("head")[0].appendChild(script);

　　優勢：咱們能夠控制請求的時機  而且這樣請求的方式是異步的 不會延長頁面加載的時間

　　重要點：咱們能夠在請求數據中調用請求頁面中的函數  使用函數的形參接收請求回來的數據

方案三：

　　在請求的後端接口設置一個 請求頭便可

　　Access-Control-Allow-Origin

　　含有這個請求頭 前端頁面跨域請求的數據就不會被瀏覽器進行攔截啦

方案四：

　　使用<iframe>標籤 將一個頁面 將能夠可變的內容部分放置在該標籤中  發送請求就會進行刷新啦  嚴格意義上不算ajax啦  

　　該方式在ajax未出現  就是使用該標籤實現請求數據的