IE9(8)跨域(CORS)解決方案


HTML5中 XMLHttpRequest Level 2 的推出。可以通過在返回的HTTP請求頭中加入 Access-Control-Allow-Origin 的設置,讓瀏覽器支持對不同域的AJAX請求。這個情況下前端AJAX的代碼不用做任何更改,只需要在服務端的返回中設置以下頭信息即可:

Access-Control-Allow-Origin: * //*代表任何域。

也可以指定地址 Access-Control-Allow-Methods: POST,GET//支持的方法

對於XHR2,IE瀏覽器的支持是IE10以上 。但是IE早在IE8時就推出了 XDomainRequest 對象進行跨域操作,一直沿用到IE10才被取代掉。因此在IE8,IE9中應該使用 XDomainRequest (XDR)來實現。 XDR在創建時是通過 new XDomainRequest() 進行創建。其他操作和XHR有細微差別。比如open方法只有method和url兩個參數,XDR只支持異步不支持同步操作。

詳細信息可以查看:https://msdn.microsoft.com/en-us/library/cc288060(v=VS.85).aspx

當然,強大的jQuery插件庫已經為我們封裝好了這種跨域方式的插件jquery.xdomainrequest.min.js,

地址為:http://cdnjs.cloudflare.com/ajax/libs/jquery-ajaxtransport-xdomainrequest/1.0.3/jquery.xdomainrequest.min.js 將此插件引入到HTML頁面中,還是不夠的,這樣只能發出去options之后的請求(也就是真正的請求),並沒有進行是否需要cors的options請求。這樣的做法,雖然服務端能返回數據,但數據是假的,或者說根本就沒收到request數據,拿登錄來說,用戶名和密碼都填寫正確,提交的時候,返回的卻是“賬戶和密碼不能為空”,這樣看來,服務端根本就沒收到request.所以針對IE9(8)還要在每次發送ajax之前進行一次判斷,是否支持cors:jQuery.support.cors = true;這樣每次發ajax之前都要先進行一次判斷,如果是高級瀏覽器,就不需要cors的兼容問題,否則要借助xdomainrequest的幫助完成請求! 

實際操作:

1、頁面引入js文件:

<script src="http://cdnjs.cloudflare.com/ajax/libs/jquery-ajaxtransport-xdomainrequest/1.0.3/jquery.xdomainrequest.min.js" type="text/javascript" charset="utf-8"></script>

2、js

jQuery.support.cors = true;
$.ajax({
       url:"http://api."+ localhostname +"/portal/reports/"+arr,
       type:"get",
       ContentType: 'text/plain',
       headers: {
              'Authorization': id + "-" + token
       },
      ...
});

好了,就這些,明天回家過年,祝大家新年快樂!

參考資料:http://liuwanlin.info/corsxiang-jie/


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM