iframe的子操作父窗口,父操作子窗口:

test.php:

<!DOCTYPE html>
<html>
<head>
<title>test</title>
</head>
<body>
<input type="text" name="csrf" id="csrf" value="parent">
<iframe src="http://127.0.0.1/csp/a.html" id="iframe"></iframe>
<script type="text/javascript">
window.onload=function()
{
var ifr = document.getElementsByTagName('iframe')[0];
alert(ifr.contentWindow.document.getElementById("csrf").value); //通过contentWindow获取子窗口中的csrf属性
alert(ifr.contentDocument.getElementById('csrf').value); //通过contentDocument 操作子窗口csrf的属性
}
</script>
<!-- <script type="text/javascript" src="data:,alert(document.cookie)"></script> --> //src后面可以写js语句
</body>
</html>

a.html

<!DOCTYPE html>
<html>
<head>
<title>test</title>
</head>
<body>
<input type="hidden" name="csrf" id="csrf" value="child">
<input type="text" name="csrf" id="csrf" value="1234312321">
<script type="text/javascript">
alert(parent.document.getElementById('csrf').value); //通过parent向上跳一级
alert(top.document.getElementById('csrf').value); //直接跳到最顶层窗口
</script>
</body>
</html>

子操作父窗口:

父操作子:

以上是在同域下操作的,可对不同页面读写操作,

如果将iframe的srcs修改为<iframe src="http://www.123.com/csp/a.html" id="iframe"></iframe>就会有如下报错:

所以可以得到如下结论:

iframe可以引入其他域的内容(只是可读的),引入本域的内容(可读可写)

1、header("X-Frame-Options:DENY"); //只要被iframe,就显示空白。

2、header("X-Frame-Options:SAMEORIGIN");  //只允许同源加载

3、header("X-Frame-Options: ALLOW-FROM https://newsn.net/");  //表示该页面可以在指定来源的 frame 中展示。

4、header("Content-Security-Policy: frame-ancestors yourdomain.com");  //chrome不支持3选项,用这个指令来设置。

在互联网发展历史上,iframe和被iframe是个永远的斗争话题,早已经从最开始的目的跑偏,已经发展为非法套别人页面,

甚至黑客技术中的点击劫持。因为,已经上升到内容和安全的高度,所以,这个iframe的问题,正日益被大家所重视。

测试1.加载test.php的内容,被拒绝。

测试2、加载同源的可以

测试三:加载外域的被拒绝。

测试四:

当测试下面的时候,发现不能如我们所愿。这个问题可能是浏览器不兼容,以后在测试

header("X-Frame-Options: ALLOW-FROM http://www.123.com/");
header("Content-Security-Policy: frame-ancestors http://www.123.com/");

参考链接:

https://developer.mozilla.org/zh-CN/docs/Web/HTTP/X-Frame-Options

https://newsn.net/say/x-frame-options-and-iframe.html

x-frame-options、iframe与iframe的一些操作的更多相关文章

  1. 使用iframe的优缺点,为什么少用iframe以及iframe和frame的区别。

    注:HTML5不再支持使用frame,iframe只有src 属性一.使用iframe的优缺点优点:1.程序调入静态页面比较方便;2.页面和程序分离;缺点:1.iframe有不好之处:样式/脚本需要额 ...

  2. frameset、frame、noframes和iframe的区别

    原网站地址:http://nmyun.blog.51cto.com/448726/155268 ■ 框架概念 :所谓框架便是网页画面分成几个框窗,同时取得多个 URL.只需要 <frameset ...

  3. flex集成IFrame,IFrame集成UnityWebPlayer直接通讯调用解决方式

    做Web开发一般是flex与JS交互,UnityWebPlayer与JS交互. 它们之间相互调用比較常见. /** * Flex调用Javascript函数 * @params functionNam ...

  4. iframe通信相关:父操作子,子操作父,兄弟通信

    这里写window和document是认为代表了BOM和DOM(个人理解不一定对) 拿到了window就能操作全局变量和函数 拿到了document就能获取dom,操作节点 父操作子 window:选 ...

  5. Ajax:HyperText/URI, HTML, Javascript, frame, frameset, DHTML/DOM, iframe, XMLHttp, XMLHttpRequest

    本文内容 Ajax 诞生 促使 Ajax 产生的 Web 技术演化 真正 Ajax Ajax 与 Web 2.0 Ajax 背后的技术 2008 年毕业,2011 年看了<Ajax 高级程序设计 ...

  6. frameset、frame和div 、iframe

    框架一般应用于首页的界面排版工作.把一个网页切割成多个页面管理.frame文件一般只包含框架的布局信息,不会包含其他内容,所有的页面效果都是在各个frameset页面内显示.他们都从属于frame文件 ...

  7. cordova iOS blank iframe iphone iframe 白屏 ios iframe 白屏

    (1)解决方案 http://stackoverflow.com/questions/36572537/cordova-ios-blank-iframe/36587026 在 index.html中配 ...

  8. 获取iframe的元素并进行操作

    获取iframe中的document元素有一下集中方法: 1.getElementById()方法和contentWindow属性: window.onload=function(){ /*必须等待页 ...

  9. [Flex] IFrame系列 —— IFrame嵌入html后Alert弹出窗口被IFrame遮挡问题

    <?xml version="1.0" encoding="utf-8"?> <!--- - - - - - - - - - - - - - ...

随机推荐

  1. SVG 旋转图形实例

    本实例展示如何在SVG中画出一个正方形并使之旋转.运行结果如下图所示: 在文本框中输入时间间隔,单位是毫秒.点击Start按钮,蓝色方块就会开始转动,每个时间间隔变化一度.变换的角度在下面的Angle ...

  2. C#Winform实时更新数据库信息Demo(使用Scoket)

    最近在贴吧上看到有个提问就是关于怎么在Winform上实时的更新数据 提问者提到的是利用Timer去轮询,但最后经过网上查了下资料,感觉Socket也是可行的, 于是就写了这个Demo 这个Demo的 ...

  3. java四则运算----前缀、中缀、后缀表达式

    接到一个新需求,需要实现可配置公式,然后按公式实现四则运算. 刚拿到需求,第一反应就是用正则匹配‘(’,‘)’,‘+’,‘-’,‘*’,‘/’,来实现四则运算,感觉不复杂. 然后开始coding.发现 ...

  4. 单点登录-SSO

    单点登录 (Single Sign-On ) 1.同域单点登录 登录的时候,设置cookie的域即可. 2.跨域单点登录 重点是,如何在浏览器端保存登录的标识. 祭图:(脑补) 三个系统: a.aaa ...

  5. Spring入门(一)— IOC、DI

    一.Spring介绍 Spring 是一个开源框架,是为了解决企业应用程序开发复杂性而创建的.框架的主要优势之一就是其分层架构,分层架构允许您选择使用哪一个组件,同时为 J2EE 应用程序开发提供集成 ...

  6. Dubbo(二) 一次惨痛的流血事故

    时间定位到2018年11月某某一天,我正在看看Spring源码的文档,趁着没啥事,忽然想起Dubbo是基于Schema扩展的,所以就翻了下Dubbo的源码. 然后的然后,有活要干了,写完代码后,启动工 ...

  7. web杂记-禁止输入框自动填充文字

    1:背景 公司基于业务需求开发了一套纯JS的时间控件,本来用得好好得.后来发现在部分浏览器下使用该时间控件会出现输入框自动填充的部分与控件的展示产生了冲突: 如图: 2:问题分析 因为部分浏览太人性化 ...

  8. 虚树(Bzoj3611: [Heoi2014]大工程)

    题面 传送门 虚树 把跟询问有关的点拿出来建树,为了方便树\(DP\) 在\(LCA\)处要合并答案,那么把这些点的\(LCA\)也拿出来 做法:把点按\(dfs\)序排列,然后求出相邻两个点的\(L ...

  9. ThreeJS模拟人沿着路径运动-路径箭头使用纹理offset偏移

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  10. bootstrap 中的 iCheck 全选反选功能的实现

    喜欢bootstrap 风格的同学应该知道,iCheck的样式还是很好看的. 官网: http://www.bootcss.com/p/icheck/ 进入正题,iCheck提供了一些方法,可以进行全 ...