幾種常見的跨域技術

 

1：圖像ping

圖像ping是與服務器進行簡單，單項的跨域通訊的一種方式
var img=new Image();
img.onload=img.onerror=function(){
     alert("done")
}
img.src="http://www.example.com/test?name=sl";

2:jsonp（最實用) jsonp是經過動態<script>元素來使用的

eg

function callbackFunction(){
   alert("回滾");
}
var script=document.createElement("script");
script.src="http://frergeoip.net.json/?callback=callbackFunction";
document.body.insertBefore(script,document.body.firstChild);

3:使用jquery實現跨域（最簡單的)

 <script> $.getJSON("http://example.com/data.php?callback=?",function(jsondata){ //回調事件 }); </script> 

只不過咱們不須要手動的插入script標籤以及定義回掉函數。
jquery會自動生成一個全局函數來替換callback=?中的問號，以後獲取到數據後又會自動銷燬，實際上就是起一個臨時代理函數的做用。
$.getJSON方法會自動判斷是否跨域，不跨域的話，就調用普通的ajax方法；跨域的話，則會以異步加載js文件的形式來調用jsonp的回調函數。

4:經過修改document.domain來跨子域

在頁面 http://www.example.com/a.html 中設置document.domain:
<iframe src="http://example.com/b.html"  id="iframe"  onload="test()"></iframe>
<script>
   document.domain="example.com";   //設置成他們的父域
   function test(){ 
      document.getElementById("iframe").contentWindow;
   }
</script>

不過若是你想在http://www.example.com/a.html 頁面中經過ajax直接請求http://example.com/b.html 頁面，即便你設置了相同的document.domain也仍是不行的，

因此修改document.domain的方法只適用於不一樣子域的框架間的交互。
若是你想經過ajax的方法去與不一樣子域的頁面交互，除了使用jsonp的方法外，還能夠用一個隱藏的iframe來作一個代理。原理就是讓這個iframe載入一個與你想要經過ajax獲取數據的目標頁面處在相同的域的頁面，因此這個iframe中的頁面是能夠正常使用ajax去獲取你要的數據的，而後就是經過咱們剛剛講得修改document.domain的方法，讓咱們能經過js徹底控制這個iframe，這樣咱們就可讓iframe去發送ajax請求，而後收到的數據咱們也能夠得到了。

5:使用window.name來進行跨域

window對象有個name屬性，該屬性有個特徵：即在一個窗口(window)的生命週期內,窗口載入的全部的頁面都是共享一個window.name的，個頁面對window.name都有讀寫的權限，window.name是持久存在一個窗口載入過的全部頁面中的，並不會因新頁面的載入而進行重置。
在a.html頁面

在a.html頁面 <script> window.name="我是a頁面設置的" </script>

在b.html頁面 <script> alert(window.name)    //彈出"我是a頁面設置的" </script>

使用window.name來獲取b頁面想要的值