谈谈浏览器 iframe 跨域的沙盒模式

栏目: Html · 发布时间: 5年前

内容简介：众所周知，现代的浏览器通过iframe调用不同域下的页面，会触发沙盒模式，比如： a.com/a.html iframe内框 b.com/b.html，b.com/b.html 的内页无法通过js操作 a.com/a.html。这样做可以防止跨域攻击，使网络访问更安全。如果更复杂的模式，比如 a.com/a.html iframe内框 b.com/b.html，b.com/b.html iframe内框 a.com/c.html，这时 a.com/c.html 可以访问 a.com/a.html吗？估计这

众所周知，现代的浏览器通过iframe调用不同域下的页面，会触发沙盒模式，比如： a.com/a.html iframe内框 b.com/b.html，b.com/b.html 的内页无法通过js操作 a.com/a.html。这样做可以防止跨域攻击，使网络访问更安全。如果更复杂的模式，比如 a.com/a.html iframe内框 b.com/b.html，b.com/b.html iframe内框 a.com/c.html，这时 a.com/c.html 可以访问 a.com/a.html吗？估计这个大部分人就都不知道了，做一个简单的实验：

1、http://www.dezaoju.com/sanbox/ 内嵌 http://www.shuodahua.com/sanbox/

2、http://www.shuodahua.com/sanbox/ 内嵌 http://www.dezaoju.com/sanbox/frame.html

经过测试，无论内嵌多少层，只要是同域的页面，测试 IE、Chrome、Firefox 都不会触发 sanbox

谈谈浏览器 iframe 跨域的沙盒模式

具体的测试代码（http://www.dezaoju.com/sanbox/index.html）：

<html>
<head>
<script>
var data = {
	name: '可以正常读取'
};
window.onload = function(){
	document.getElementById("test").value = window.top.data.name;
};
</script>
</head>
<body>
<h1>www.dezaoju.com/sanbox/</h1>
<input id="test"><br><br>
<iframe src="http://www.shuodahua.com/sanbox/" width="80%" height="600"></iframe>
<br>
</body>
</html>

http://www.dezaoju.com/sanbox/index.html：

<html>
<head>
<script>
window.onload = function(){
	document.getElementById("test").value = window.top.data.name;
};
</script>
</head>
<body>
<h1>www.shuodahua.com/sanbox/</h1>
<input id="test"><br><br>
<iframe src="http://www.dezaoju.com/sanbox/frame.html" width="80%" height="400"></iframe>
</body>
</html>

http://www.dezaoju.com/sanbox/frame.html：

<html>
<head>
<script>
window.onload = function(){
	document.getElementById("test").value = window.parent.parent.data.name;
};
</script>
</head>
<body>
<h1>www.dezaoju.com/sanbox/frame.html</h1>
<input id="test">
</body>
</html>

可能您看到这里，会说了解这些有毛用啊，能赚钱吗？

是的，能赚钱！

一般个人的网站，靠广告联盟变现是一个非常重要的途径。一般广告联盟都会非常人性化，对没有匹配到广告的广告位，支持显示用户自己的广告。以大名鼎鼎的Google Adsense为例，在广告设置中可以设置“ 如果没有可投放的广告，展示其他网址 ”，这样我们既可以在没有广告时，显示另一个广告联盟的广告（比如：百度）。

谈谈浏览器 iframe 跨域的沙盒模式

这样流量不浪费了，却很容易被广告判断为作弊（每次访问的页面都是一样的，只有广告代码）。解决也很简单，直接在 如果没有可投放的广告，展示其他网址 页面中动态加载广告代码就可以了，这是来路域名为真实的来路，不仅能赚钱，还能避免当做作弊被封号。

上面的例子中，http://www.dezaoju.com/sanbox/ 为我们的网页；http://www.dezaoju.com/sanbox/ 为谷歌联盟；www.dezaoju.com/sanbox/frame.html 为匹配不到广告是，展示的页面。最终的效果如下：

谈谈浏览器 iframe 跨域的沙盒模式

对 www.dezaoju.com/sanbox/frame.html的修改：

<script>

<html>
<head>
<script>
window.onload = function(){
	document.getElementById("test").value = window.parent.parent.data.name;
	
	var doc = window.top.document;
	var ad = doc.createElement('div');
	ad.innerHTML = '<iframe src="http://www.dezaoju.com/sanbox/ad.html"></iframe>';
	doc.body.appendChild(ad);
};
</script>
</head>
<body>
<h1>www.dezaoju.com/sanbox/frame.html</h1>
<input id="test">
</body>
</html>

广告页的代码很简单（www.dezaoju.com/sanbox/ad.html），只是为了判断来路地址：

来路域名：<script>document.write(document.referrer);</script>

以上所述就是小编给大家介绍的《谈谈浏览器 iframe 跨域的沙盒模式》，希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对码农网的支持！

查看所有标签

猜你喜欢:

本站部分资源来源于网络，本站转载出于传递更多信息之目的，版权归原作者或者来源机构所有，如转载稿涉及版权问题，请联系我们。

码农书籍

Java Web开发从初学到精通

方振宇 / 电子工业 / 2010-6 / 69.00元

《Java Web开发从初学到精通》介绍如何整合Web框架进行J2EE开发，所有实例都基于MyEclipse IDE开发，引领读者快速进入基于JaVa web的J2EE应用领域。《Java Web开发从初学到精通》开始主要介绍Servlet、JSP、JavaBean、EL、JSTL、JDBC等Web开发基础知识，然后学习Struts、Hibernate、Spring、Ajax、JSF等开源框架，并......一起来看看《Java Web开发从初学到精通》这本书的介绍吧!

码农工具