window.name + iframe前端跨域

最新推荐文章于 2021-07-11 11:01:23 发布

凤凰谷1

最新推荐文章于 2021-07-11 11:01:23 发布

阅读量2.9k

点赞数 2

分类专栏： js 跨域文章标签： js 跨域 window.name iframe

本文链接：https://blog.csdn.net/u011089760/article/details/93558297

版权

js 同时被 2 个专栏收录

5 篇文章 0 订阅

订阅专栏

跨域

4 篇文章 0 订阅

订阅专栏

概述：

window.name这个属性不是一个简单的全局属性 --- 只要在一个window下，无论url怎么变化，只要设置好了window.name，那么后续就一直都不会改变，同理，在iframe中，即使url在变化，iframe中的window.name也是一个固定的值，利用这个，我们就可以实现跨域了

代码实例：

test1.html

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>test1</title>
</head>
<body>
  <h2>test1页面</h2>
  <iframe src="http://192.168.1.10/php_demo/test2.html" frameborder="1"></iframe>
  <script>
    var ifr = document.querySelector('iframe')
    ifr.style.display = 'none'
    var flag = 0;
    ifr.onload = function () {
        console.log('跨域获取数据', ifr.contentWindow.name);
        ifr.contentWindow.close();
    }
  </script>
</body>
</html>

test2.html

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>test2</title>
</head>
<body>
  <h2>test2页面</h2>
  <script>
    var person = {
      name: 'wayne zhu',
      age: 22,
      school: 'xjtu'
    }
    window.name = JSON.stringify(person)
  </script>
</body>
</html>

使用浏览器访问test1.html:http://192.168.1.10/php_demo/test1.html

运行截图：

参考文献：https://www.cnblogs.com/zhuzhenwei918/p/7403796.html

凤凰谷1

关注

2
点赞
踩
10

收藏

觉得还不错? 一键收藏
0
评论
window.name + iframe前端跨域

概述： window.name这个属性不是一个简单的全局属性 --- 只要在一个window下，无论url怎么变化，只要设置好了window.name，那么后续就一直都不会改变，同理，在iframe中，即使url在变化，iframe中的window.name也是一个固定的值，利用这个，我们就可以实现跨域了代码实例：test1.html<!DOCTYPE html&gt...
复制链接

扫一扫