跨域問題解決辦法

跨域問題

1. 設置Access-Control-Allow-Origin
服務器端對於CORS的支持，主要就是通過設置Access-Control-Allow-Origin來進行的。如果瀏覽器檢測到相應的設置，就可以允許Ajax進行跨域的訪問。通過設置Access-Control-Allow-Origin來實現跨域訪問比較簡單。
例如：
客戶端的域名是www.client.com,而請求的域名是www.server.com
如果直接使用ajax訪問，會有以下錯誤

XMLHttpRequest cannot load http://www.server.com/server.php. No 'Access-Control-Allow-Origin' header is present on the requested resource.Origin 'http://www.client.com' is therefore not allowed access.

修改被請求的Response header

• java

response.setHeader("Access-Control-Allow-Origin", "*");

添加位置可以在下面三處任選一個。
（1）可以在過濾器 filter 中的 dofilter() 方法設置。
（2）可以在 servlet 的 get 或者 post 方法裏面設置。
（3）可以放在訪問的 jsp 頁面第一行。

• PHP

// 指定允許其他域名訪問  
header('Access-Control-Allow-Origin:*');  
// 響應類型  
header('Access-Control-Allow-Methods:POST');  
// 響應頭設置  
header('Access-Control-Allow-Headers:x-requested-with,content-type');  

2. JSONP

3. document.domain
將子域和主域的document.domain設爲同一個主域。前提條件：這兩個域名必須屬於同一個基礎域名！而且所用的協議，端口都要一致，否則無法利用document.domain進行跨域。

• 在頁面 http://www.example.com/a.html 中設置document.domain:

<script type="text/javascript">
    document.domain = 'example.com';//設置成主域
    function test(){
        alert(document.getElementById('iframe').contentWindow);//contentWindow 可取得子窗口的 window 對象
    }
</script>

• 在頁面 http://example.com/b.html 中也設置document.domain:

<script type="text/javascript">
    document.domain = 'example.com';//在iframe載入這個頁面也設置document.domain，使之與主頁面的document.domain相同
</script>

4. window.name
window對象有個name屬性，該屬性有個特徵：即在一個窗口(window)的生命週期內,窗口載入的所有的頁面都是共享一個window.name的，每個頁面對window.name都有讀寫的權限，window.name是持久存在一個窗口載入過的所有頁面中的

5. window.postMessage
window.postMessage(message,targetOrigin) 方法是html5新引進的特性，可以使用它來向其它的window對象發送消息，無論這個window對象是屬於同源或不同源，目前IE8+、FireFox、Chrome、Opera等瀏覽器都已經支持window.postMessage方法。