首頁  >  文章  >  後端開發  >  PHP下ajax跨域的解決方案之window.name實例分析詳解

PHP下ajax跨域的解決方案之window.name實例分析詳解

coldplay.xixi
coldplay.xixi轉載
2020-08-05 16:55:121905瀏覽

PHP下ajax跨域的解決方案之window.name實例分析詳解

本文實例講述了PHP下ajax跨域的解決方案之window.name。分享給大家供大家參考,具體如下:

原理核心:window物件的name屬性是一個很特別的屬性,當該window的location變化,然後重新加載,它的name屬性可以依然保持不變。

依此原理,我們可以在頁面A中用iframe載入其他網域的頁面B,而頁面B中用JavaScript把需要傳遞的資料賦值給window.name,頁面A的iframe載入完成之後,頁面A修改iframe的位址,將其變成同域的一個位址,然後就可以唸出window.name的值了。

相關學習推薦:php程式設計(影片)

#範例:有兩個網站www.a.com和www.b.com,我們要在www.a.com/a.html下取得www.b.com/data.html資料。

我們需要三個檔案:

www.a.com 下的a.html 取得數據並顯示
www.b.com 下的data.html 提供數據
www.a.com 下的proxy.html 代理文件,與a.html同一網域下,一般為空html檔。

www.b.com下的data.html如下:

<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>Insert title here</title>
</head>
<body>
  <script type="text/javascript">
    //添加需要传递的数据,大小一般为2M,IE和firefox下可以大至32M左右
    window.name = &#39;[{"name":"test1"},{"name":"test2"}]&#39;;
  </script>
</body>
</html>

www.a.com下的proxy.html如下:

<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>Insert title here</title>
</head>
<body>
  <!-- 空的html文件 -->
</body>
</html>

www.a .com下的a.html如下:

<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>Insert title here</title>
</head>
<body>
 
<!-- 用于引用www.b.com/data.html文件 -->
<iframe id="iframe" src=""></iframe>
 
<!-- 显示获取到的数据 -->
<p id="data"></p>
 
<script type="text/javascript" src="./jquery.js"></script>
<script type="text/javascript">
var ifr = document.getElementById("iframe");
ifr.src = "http://www.b.com/data.html";
if (ifr.attachEvent) {
  ifr.attachEvent("onload", loadfunc);
} else {
  ifr.onload = loadfunc;
}
 
var state = 0;
function loadfunc() {
  if(state == 0) {
    state = 1;
    ifr.contentWindow.location = "http://www.a.com/proxy.html";
  } else {
    var data = ifr.contentWindow.name;
    $.each($.parseJSON(data), function(i, v) {
      $("#data").append(v.name);
    });
     
    //销毁iframe,保证安全
    ifr.contentWindow.document.write("");
    ifr.contentWindow.close();
    document.body.removeChild(ifr);
  }
}
</script>
</body>
</html>

相關影片推薦:PHP程式設計從入門到精通

以上是PHP下ajax跨域的解決方案之window.name實例分析詳解的詳細內容。更多資訊請關注PHP中文網其他相關文章!

陳述:
本文轉載於:jb51.net。如有侵權,請聯絡admin@php.cn刪除