解決Ajax不能跨域的方法


1.  Ajax不能跨域請求的原因

同源策略(Same Origin Policy),是一種約定,該約定阻止當前腳本獲取或者操作另一個域下的內容。所有支持Javascript的瀏覽器都支持同源策略,也就是說瀏覽器可以隔離來自不同源的內容,阻止跨域請求的發生。

2. 解決方法

(1) CORS

在被請求的腳本中使用header()函數設置http響應,從而使得跨域請求能夠發生:

header(“Access-Control-Allow-Origin:*”);

這一方法稱為CORS(Cross-Origin Resource Sharing),是w3c的工作草案。

(2) 使用Jsonp (Json with padding)

jsonp的原理是通過script標簽的src屬性來請求不同源的腳本。

步驟:

1) 創建script標簽,設置src屬性

2) 定義回調函數

3) 在被請求的php腳本中執行回調函數

4) 在回調函數中處理返回數據

 

發送跨域請求的html頁面:

 1 <script type="text/javascript">
 2     function crossDomain()  3  {  4         //1.創建script標簽,設置src屬性
 5         var script = document.createElement('script');  6         //在script標簽的src屬性中發送跨域請求
 7         //傳遞get參數 --> 回調函數的名字
 8         script.src = 'http://www.another.com/index.php?name=Jonas&fn=say';  9         document.getElementsByTagName('head')[0].appendChild(script); 10  } 11 
12     //2.定義回調函數
13     function say(data) 14  { 15         //4.處理返回數據
16  console.log(data); 17  } 18 </script>

  接收跨域請求的php頁面: 要執行回調函數

1 <?php 2 //3.執行回調函數,將返回數據以參數的形式傳給回調函數
3 $data = json_encode(array('msg' => 'hello world')); 4 echo $_GET['fn'] . "({$data})"; 5 ?>

 


免責聲明!

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



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