瀏覽器攔截跨域請求處理方法(已阻止跨源請求:同源策略禁止讀取遠程資源)

原文地址：http://my.oschina.net/lichaoqiang/blog/317823

在瀏覽器請求中，出現跨域訪問資源的問題，我們肯定會遇到。如果跨域請求被阻止，有可能導致css、js 、ajax請求、font字體等資源出現無法正常訪問的問題。接下來，就介紹下解決同源策略不允許讀取遠程資源的問題。

    今天就談下遠程字體跨域的問題。

    直接了當了說，解決此類問題，最直接的方法就是，就是給被請求的服務器，添加HTTP頭響應頭，這里提供兩種添加HTTP頭的方法：

    第一種，就是在程序中添加HTTP頭：   

如： Response.Headers.Add("Access-Control-Allow-Origin", "*");
// JSON
{
  'Access-Control-Allow-Origin': '*', 
}
// HTML
<meta http-equiv="Access-Control-Allow-Origin" content="*">
// PHP
header("Access-Control-Allow-Origin: *");
header("Access-Control-Allow-Headers: Origin, X-Requested-With, Content-Type, Accept");

   添加此段代碼的目的很簡單，也就是告訴瀏覽器，這個資源是運行遠程所有域名訪問的。當然，此處的*也可以替換為指定的域名，出於安全考慮，建議將*替換成指定的域名。

   第二種，就是在服務器上，添加HTTP響應頭。在這里，我們就以IIS6.0為例：

   在被請求的網站上，設置HTTP頭，添加“

//在被請求的網站上，設置HTTP頭，添加
"Access-Control-Allow-Origin:*" //值為*或指定的域名。

   第三種，使用JSONP格式，即在jQuery中ajax請求參數dataType:'JSONP'：   

<script> $.ajax({ 
        url:"http://map.oicqzone.com/gpsApi.php?lat=22.502412986242&lng=113.93832783228", 
        type:'GET', 
        dataType:'JSONP',  // 處理Ajax跨域問題
 success: function(data){ 
            $('body').append( "Name: " + data ); 
        } 
    }); 
</script>

   一般完成以上工作，就可以了。網上還有說在被請求服務器根目錄下創建:"crossdomain.xml"的文件。內容格式如下：

<?xml version="1.0"?>
<cross-domain-policy>
  <allow-access-from domain="*" />
</cross-domain-policy>