window.name?

每一个页面都有一个自己的window,而window.name是window的名字。

window.name跨域原理

window对象有个name属性,该属性有个特征:即在一个窗口(window)的生命周期内,窗口载入的所有的页面都是共享一个 window.name的,每个页面对window.name都有读写的权限,window.name是持久存在一个窗口载入过的所有页面中的,并不会因 新页面的载入而进行重置。
即我们在"http://www.baidu.com"页面的控制台设置window.name = "name=123",然后我们在控制台修改window.location.href = "http://www.youku.com",跳转页面后我们在控制台打印window.name,我们发现结果为我们刚才设置的'name=123'
利用此原理我们可以利用window.name来传递信息,且window.name可传递的信息量为2M,足够使用了。

操作如下

比如我们想要在a.html页面获取data.html页面传递的信息

首先我们在htttp://www.example.com/data.com页面下添加如下代码:

 <script>
// 将我们想传递的信息赋值到data.html页面的window.name上
window.name = "{"name":"lyl", "age": 18}";
</script>

然后我们如何修改data.html页面的window.href,将其改变我a.html呢?显然我们无法在data.html页面修改window.href,所以我们利用一个隐藏iframe将data.html页面嵌入到a.html页面中,让iframe作为一个代理人,让iframe去代替我们获取数据
虽然iframe能获取到data.html页面的数据,那a.html页面如何向iframe获取数据呢,直接获取?
但是a.html和iframe不同域,受同源策略的影响,我们无法直接获取,怎么办?
这时,聪明的你灵机一动,想着既然改变iframe页面location,该页面的window.name值不变,而且iframe.contentWindow代表iframe页面的window,此时的你默默的将iframe.contentWindow.href改为和a.html页面同源的,拿走数据后,带着莫名的笑意看我我们一群迷茫的愤青(O(∩_∩)O哈!)

a.html页面代码如下:

<script>
function getData(url) {
var iframe = document.createElement('iframe');
iframe.style.display = "none";
var state = 0;
iframe.onload = function () {
if(state === 1) {
var data = iframe.contentWindow.name;
console.log(data);
// 获取到数据后将隐藏的iframe去除
iframe.contentWindow.document.write('');
iframe.contentWindow.close();
document.removeChild(iframe);
}else if(state === 0) {
state = 1;
iframe.contentWindow.location.href = window.location.href;
}
} iframe.src = url;
document.body.appendChild(iframe);
}
</script>
 

参考

  1. http://www.cnblogs.com/zichi/p/4620656.html

  2. http://www.cnblogs.com/fliu/articles/5249130.html

window.name跨域的更多相关文章

  1. window.name 跨域

    跨域的由来 JavaScript出于安全方面的考虑,不允许跨域调用其他页面的对象.但是我们常常会遇到无法避免跨域的情况,如普通文章站点(article.xxx.com)需要评论,而评论站点却在chea ...

  2. JS window.name跨域封装

    JS window.name 跨域封装 function CrossDomainName(target, agent, callback, security) { if (typeof target ...

  3. window.returnValue跨域传值问题[转]

    主页面用window.showModalDialog的时候,如果直接打开其它系统的页面,这时候别人的页面在window.returnValue=1;这样返回值的时候,主页面是取不到返回值的,原因就是因 ...

  4. HTML5 window/iframe跨域传递消息 API

    原文地址:HTML5′s window.postMessage API 在线示例:Using HTML5's window.postMessage(请打开控制台看日志) 原文日期: 2010年09月0 ...

  5. (二)文档请求不同源之window.name跨域

    一.基本原理 window.name不是一个普通的全局变量,而是当前窗口的名字.这里要注意的是每个iframe都有包裹它的window,而这个window 是top window的子窗口,而它自然也有 ...

  6. (二)文档请求不同源之window.postMessage跨域

    一.基本原理 HTML5为了解决跨域,引入了跨文档通信API(Cross-document messaging).这个API为window对象新增了一个window.postMessage方法,允许跨 ...

  7. window.name跨域实现

    参考:window.name实现的跨域数据传输 有三个页面: a.com/app.html:应用页面. a.com/proxy.html:代理文件,一般是一个没有任何内容的html文件,需要和应用页面 ...

  8. window.name 跨域数据传输

    通过window.name可以实现跨域数据传输. 要解决的功能:  www.a.com/a.html 需要获取到 www.b.com/b.html页面内容的数据 需要3个页面 www.a.com/a. ...

  9. HTML5之worker开启JS多线程模式及window.postMessage跨域

    worker概述 worker基本使用 window下的postMessage worker多线程的应用 一.worker概述 web worker实际上是开启js异步执行的一种方式.在html5之前 ...

随机推荐

  1. ZOJ 3962 Seven Segment Display 16进制的八位数加n。求加的过程中所有的花费。显示[0,F]有相应花费。

    Seven Segment Display Time Limit: Seconds Memory Limit: KB A seven segment display, or seven segment ...

  2. Eclipse 菜单

    Eclipse 菜单 Eclipse 查看的菜单栏通常包含以下几个菜单: File 菜单 Edit 菜单 Navigate 菜单 Search 菜单 Project 菜单 Run 菜单 Window ...

  3. 在eclipse中使用枚举简单类型enum

    在JAVA中终于可以使用枚举类型了,就像在C或C++使用的简单枚举. 首先就在eclipse中试试它吧. 没想到,却报了错误.我装了jdk1.5(5.0),也在eclipse中设置了,怎么会不认识en ...

  4. C#二进制序列化和反序列化

    public class WRSerializable { public static void SerializeToFile<T>(T _description, string _fi ...

  5. Unity如何判断网络连接类型

    今天遇到了一个问题,如何判断手机游戏当前的网络连接类型,是wifi还是234G? 起初准备在Android中写好插件供Unity调用,后来在网上浏览众神的帖子时,在csdn上看到了使用NetworkR ...

  6. (转载)Unity中解析ini配置文件----INIParser

    大家好,我是孙广东.   转载请注明出处:http://blog.csdn.net/u010019717 更全的内容请看我的游戏蛮牛地址:http://www.unitymanual.com/spac ...

  7. 解决ionic 2载入速度慢的问题

    1.ionic build android  --prod 使用生产环境的服务器 (最关键部分) [--production-mode=y,n]  .................  Tell Io ...

  8. 数值孔径NA、分辨率极限与衍射极限

    一.数值孔径  数值孔径(NA):是一个无量纲的数,用以衡量该系统能够收集的光的角度范围.越大,收集到的光越多,分辨率越高. 描述了透镜收光锥角的大小,决定着透镜收光能力和空间分辨率. 数值孔径(NA ...

  9. mysql的体系架构和存储引擎

    定义数据库和实例 数据库:物理操作系统的文件或其他形式文件类型的集合.在mysql数据库中,数据库文件可以是frm.MYD.MYI.ibd结尾的文件. 实例:MySQL数据库由后台线程以及一个共享内存 ...

  10. 【穿插】Python基础之文件、文件夹的创建,对上一期代码进行优化

    在上一期妹子图的爬虫教程中,我们将图片都保存在了代码当前目录下,这样并不便于浏览,我们应该将同一个模特的图片都放在一个文件夹中. 今天我们就简单讲一下Python下如何创建文件.文件夹,今后就可以用上 ...