前端跨域

1:jquery實現jsop方式：$.ajax({ url:'http://www.nealyang.cn/login', type:'GET', dataType:'jsonp',//請求方式為jsonp jsonpCallback:'callback', data:{ "username":"Nealyang" } })但只能夠實現get請求。 //去建立一個script標籤 var script = document.createElement("script"); //script的src屬性設定介面地址 並帶一個callback回撥函式名稱 script.src = "http://127.0.0.1:8888/index.php?callback=jsonpCallback"; //插入到頁面 document.head.appendChild(script); //通過定義函式名去接收後臺返回資料 function jsonpCallback(data){ //注意 jsonp返回的資料是json物件可以直接使用 //ajax 取得資料是json字串需要轉換成json物件才可以使用。 } 2:cors:跨域資源共享： 原理：伺服器設定Access-Control-Allow-OriginHTTP響應頭之後，瀏覽器將會允許跨域請求 限制：瀏覽器需要支援HTML5，可以支援POST，PUT等方法相容ie9以上 需要後臺設定 Access-Control-Allow-Origin: * //允許所有域名訪問，或者 Access-Control-Allow-Origin: http://a.com //只允許所有域名訪問 設定document.domain: 原理：相同主域名不同子域名下的頁面，可以設定document.domain讓它們同域 限制：同域document提供的是頁面間的互操作，需要載入iframe頁面 var ifr = document.createElement('iframe'); ifr.src = 'http://b.a.com/bar'; ifr.onload = function(){ var ifrdoc = ifr.contentDocument || ifr.contentWindow.document; ifrdoc.getElementsById("foo").innerHTML); };

ifr.style.display = 'none'; document.body.appendChild(ifr); 或用Apache做轉發（逆向代理），讓跨域變成同域。