`

跨域学习 - window.name

阅读更多
利用window.name实现跨域。

window.name
引用
一个字符串,存放了窗口的名称。这个名称是在open()方法创建窗口时指定的或者使用一个<frame>标记的name属性制定的。窗口的名称可以用作一个<a>或者<form>的target属性的值,以这种方式使用target属性声明了超链接文档或表单提交结果应该显示于指定的窗口或帧中。


window.name跨域主要利用iframe中的中内部更换页面,但是iframe的window.name值不会因为页面改变而改变。

域1的主要页面:
<!DOCTYPE html>
<html>
<head>
  <title>father page</title>
</head>
<body>
  <h1 class="title">Father page, host: <span></span></h1>
  <form action="http://www.valley2.com/pro01-winname/login.php" target="rFrame">
    <div>
      <span>username:<span><input type="text" name="u" />
    </div>
    <div>
      <span>password:<span><input type="text" name="p" />
    </div>
    <div>
      <input type="submit" value="submit" />
    </div>
  </form>
  <!--<iframe id="idFrame" name="rFrame" src=""></iframe>-->
  <div id="idResult"></div>
  <br><br><br>
<script>
//title
var h1Node = document.getElementsByClassName('title')[0];
var spanNode = h1Node.getElementsByTagName('span')[0];
spanNode.innerHTML = location.host;

var frame = document.createElement('iframe');
frame.setAttribute('name', 'rFrame');
document.body.appendChild(frame);
var status = 0;
frame.onload = function() {
    if (status == 1) {
        var window = frame.contentWindow;
        var resultNode = document.getElementById('idResult');
        resultNode.innerHTML = window.name;
    } else if (status == 0) {
        frame.contentWindow.location = 'http://www.valley.com/pro01-winname/proxy.html';
        status = 1;
    }
};

</script>
</body>
</html>


域1的跳转页面:
<div>proxy</div>


域2的数据页面:
<?php
if (isset($_GET['u']) && $_GET['u'] === 'valley'
    && isset($_GET['p']) && $_GET['p'] === 'password') {
    $result = 'login';
} else {
    $result = 'nologin';
}
echo '<script>';
echo "window.name='$result';";
echo '</script>';
分享到:
评论

相关推荐

    window.name解决跨域问题的文档

    window.name 解决跨域问题的文档 window.name 传输技术是 Thomas Frank 发明的,旨在解决 cookie 的一些劣势,例如每个域名 4 x 20 Kb 的限制、数据只能是字符串、设置和获取 cookie 语法的复杂等等。后来,Kris ...

    跨域问题 之 window.name

    标题提到的“跨域问题之window.name”是指在处理跨域通信时,开发者利用`window.name`属性来传递数据的一种策略。这种技术主要应用于iframe之间的通信,因为浏览器的同源策略限制了不同源的页面直接交互,但`window....

    利用window.name跨域解决方案Demo.rar

    本Demo实现了一个来自不同服务器的前端页面集成方案,页面间通过window窗口关系形成父子页面关系,跨域情况下父子页面间彼此看不见对方的DOM和js对象,无法直接进行数据交互。本方案从父页面到子页面数据传递采用url...

    javascript跨域总结之window.name实现的跨域数据传输

    在实际应用中,需要注意的是,使用window.name进行跨域数据传输时,需要确保数据传输过程中,iframe的src属性总是指向与应用页面同域的页面,这样才能安全地读取window.name中的数据。 总结而言,window.name是一个...

    Allow-Control-Allow-Origin.rar

    5. **Window.name**:当页面重定向或刷新时,`window.name` 的值会保留,可以在不同源之间传递大量数据。 了解这些跨域解决方案后,开发者可以根据项目需求和环境选择合适的处理方式。"Allow-Control-Allow-Origin....

    iframe-cross-domain.rar

    3. **Window.name属性**:由于Window对象的`name`属性不会因页面重载而改变,所以可以利用这个特性在跨域的iframe之间传递信息。但是,这种方法的局限性在于只能在页面刷新后仍然保持数据,不适用于实时通信。 4. *...

    javascript 打开页面window.location和window.open的区别.docx

    - **跨域限制**:使用 `window.location` 或 `window.open` 时需要注意同源策略,确保不会违反跨域限制。 #### 七、总结 综上所述,`window.location` 和 `window.open` 在JavaScript中都扮演着重要的角色,但在...

    js弹窗并返回值(window.open方式)

    这个名称可以用于后续的引用,如`window.name`,或者在`window.open`中重用窗口。 - `features`: 可选参数,一个描述新窗口特性的字符串,比如宽度、高度、位置等。也可以包含像`scrollbars=yes`这样的选项来控制...

    window.open打开新窗口参数设置

    var newWindow = window.open(url, name, features, replace); ``` - **url**:必需参数,字符串类型,表示新窗口中要加载的文档的URL。 - **name**:可选参数,字符串类型,指定新窗口的名字,这个名称可以用来与`...

    name-storage:通过 window.name 存储

    nameStoragenameStorage 是类似 sessionStroage 的键值对数据存储工具,但是可以跨域。nameStorage 适用于同一窗口内跨页面数据存储与传递。技术上,nameStorage 使用 window.name 存储数据。数据的生存周期为窗口...

    javascript使用window.name解决跨域问题第1/2页

    JavaScript中的`window.name`属性是一个独特且强大的工具,尤其在处理跨域通信时。它不受同源策略的限制,可以在不同页面甚至不同域名之间保持其值。这是因为`window.name`的值在页面重载或导航至其他URL时仍然保留...

    跨域的三个html例子

    如果新的页面也在同一窗口或框架内打开,并且可以访问到`window.name`,就可以实现跨域数据传递。例如: ```html &lt;!DOCTYPE html&gt; window.name = 'sharedData'; location.href = '...

    javascript跨域的方法汇总.docx

    然后,通过A页面的代理文件C.html(与A页面同源),A页面可以安全地读取到`iframe`中的`window.name`,实现跨域数据传输。 4. `window.location.hash`和`iframe` 此方法结合了`hash`和`iframe`,B页面将数据编码后...

    什么是跨域解决方案有哪些.docx

    5. window.name + iframe 跨域 6. postMessage 跨域 7. nginx 代理跨域 8. nodejs 中间件代理跨域 9. WebSocket 协议跨域 一、 通过 jsonp 跨域 通常为了减轻 web 服务器的负载,我们把 js、css,img 等静态资源...

    iframe跨域解决方案

    综上所述,`iframe`跨域解决方案主要包括`postMessage`通信、`window.name`数据传递以及`CORS`策略。在实际应用中,开发者应根据具体需求和安全考虑,选择合适的跨域策略。同时,需要注意的是,虽然这些方法能突破...

    window.open父子窗口传值问题

    var newWindow = window.open(url, name, features); ``` - `url`: 子窗口要加载的URL。 - `name`: 窗口的名字,可以用于后续引用。 - `features`: 一个字符串,包含新窗口的尺寸、位置和其他特性。 在Tomcat...

    window.name解决跨域数据传输问题

    原文:http://research.microsoft.com/~helenw/papers/subspace.pdfwindow.name 传输技术,原本是 Thomas Frank 用于解决 cookie 的一些劣势(每个域名 4 x 20 Kb 的限制、数据只能是字符串、设置和获取 cookie 语法...

    windowName跨域详解.pdf

    在跨域资源访问的场景下,window.name属性被广泛地用来实现安全的数据传输。 首先,window.name属性能够在不同的页面加载后仍然保持不变,前提是该属性未被重新赋值。这一特性允许开发者在iframe加载新页面后,依然...

Global site tag (gtag.js) - Google Analytics