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. vim 编辑器常规操作

    所看视频教程:兄弟连Linux云计算视频教程5.1文本编辑器Vim-5.2 插入命令 a:在光标所在字符后插入; A:在光标所在行尾插入; i:在光标所在字符前插入; I:在光标所在字符行行首插入; ...

  2. SpringBoot 初体验

    1.Spring Boot 简介 简化Spring应用开发的一个框架 整个Spring技术栈的一个大整合 J2EE开发的一站式解决方案 2.微服务 2014, martin fowler 微服务:架构 ...

  3. SSM maven框架下载简易版

    1.前台一个a标签,写个地址就行了 例如 <a href="${pageContext.request.contextPath}/fileDownLoad">前去下载& ...

  4. springboot基本注解

    声明Bean的注解: @Component组件 @Service service层 @Respository dao层 @Controller 注入Bean的注解: @Autowired Spring ...

  5. MyBatis学习(一)---配置文件，Mapper接口和动态SQL

    MyBatis MyBatis官方学习网站 http://www.mybatis.org/mybatis-3/zh/index.html 为什么需要MyBatis? Jdbc操作数据库的不足之处 1. ...

  6. 前端面试题1（html）

    HTML     * Doctype作用?严格模式与混杂模式如何区分?它们有何意义? 1.<!DOCTYPE> 声明位于文档中的最前面的位置,处于 <html> 标签之前.此标 ...

  7. MongoDB 投影

    mongodb 投影意思是只选择必要的数据而不是选择一个文件的数据的整个.例如一个文档有5个字段,只需要显示其中3个 find() 方法 在MongoDB中,当执行find()方法,那么它会显示一个文 ...

  8. Word 关闭 Passive Voice

      Sheryl prefers passive voice for some of her writing (such as business documents and correspondenc ...

  9. 单选按钮（RadioButton）

    一:RadioButton的相关属性: 1.Activity //单选按钮 public class RadioButtonActivity extends Activity { private Co ...

  10. UIResponder NSSet UITouch UIEvent

    UIResponder: UIView的超类,用来响应handle(触屏.motion.响应者等)事件. NSSet:一系列的类集合(类似数组). UITouch:一个点击类.负责:点击的view,w ...