为了轻松偷懒,不想从目的项目中开发目标项目中的页面,但目的项目中需要获取老项目中的页面,这里用了iframe跨域链接页面出现了问题

Blocked a frame with origin "http://......" from accessing a cross-origin frame.

出现此报错的原因是因为在http://driversys.edaijia.cc 下操作 http://www.edaijia.cc   下的dom导致。

项目框架是yii2,代码如下,项目中是在看代码中http://driversys.edaijia.cc 下操作的iframe连接指向是http://www.edaijia.cc   dom元素。

//http://driversys.edaijia.cc 项目下代码
<?php
Modal::begin([
'id' => 'create-modal-article',
'header' => '<h4 class="modal-title">选择长文章</h4>',
'footer' => '<a href="javascript:;" class="btn btn-info" id="confirm_article" >确定</a><a href="javascript:;" class="btn btn-danger" id="close_article_window" >关闭</a>',
]);
$requestUrl = 'http://www.edaijia.cc/v2/index.php?r=newNoticePost/selection';
$js = <<<JS
$('#create-modal-article .modal-body').html('<iframe name="article_ifm" id="add_long_article" width="99%" height="100%" style="border:0px"></iframe>');
$("#add_long_article").attr("src", 'http://www.edaijia.cc/v2/index.php?r=newNoticePost/selection'); $('#create-modal-article').find('.modal-header').find('.close').hide();
JS;

解决方法:

在父页面添加监听器,接收子页面的值:

window.addEventListener('message',function(e){

alert(e.data);

},false);

在子页面在要传值的地方调用以下语句传值:

window.parent.postMessage('值','http://www.....);

解决代码:

//http://www.edaijia.cc项目代码 

$("#new-notice-post-grid :radio").on('click', function () { //监听radio选中,并把值传递
window.parent.postMessage([$(this).attr('did'),$(this).val()],'http://driversys.edaijia.cc');
})
//http://driversys.edaijia.cc  项目代码,获取传递的值
//长文章radio获取
window.addEventListener('message',function(e){
window.did = e.data[];
window.title = e.data[]; },false);

跨域问题 Blocked a frame with origin "http://......" from accessing a cross-origin frame.的更多相关文章

  1. java、ajax 跨域请求解决方案('Access-Control-Allow-Origin' header is present on the requested resource. Origin '请求源' is therefore not allowed access.)

      1.情景展示 ajax调取java服务器请求报错 报错信息如下: 'Access-Control-Allow-Origin' header is present on the requested ...

  2. 前后端分离 导致的 静态页面 加载 <script type="module" > 报CORS 跨域错误,提示 blocked by CORS policy

    1.前言 静态页面 加载 <script type="module" > 报CORS 跨域错误,提示Access to script at ftp:///xxx.js ...

  3. js如何获取跨域iframe 里面content

    每天学习一点点 编程PDF电子书.视频教程免费下载:http://www.shitanlife.com/code 其中src可能存在跨域. 现有的获取方式   var test = document. ...

  4. 跨域传输信息postMessage

    widnow.postMessage()方法允许安全的跨域传输. Syntax otherWindow.postMessage(message, targetOrigin, [transfer]); ...

  5. 前端Js跨域方法汇总—剪不断,理还乱,是跨域

    1.通过jsonp跨域2.通过修改document.domain来跨子域(iframe)3.隐藏的iframe+window.name跨域4.iframe+跨文档消息传递(XDM)5.跨域资源共享 C ...

  6. CP="CAO PSA OUR" 用P3P header解决iframe跨域访问cookie

    1.IE浏览器iframe跨域丢失Session问题 在开发中,我们经常会遇到使用Frame来工作,而且有时是为了跟其他网站集成,应用到多域的情况下,而Iframe是不能保存Session的因此,网上 ...

  7. 前端页面调用Spring boot接口发生的跨域问题

    最近要重构一个基于spring boot的后端API服务,需要再本地测试.在本地测试时,运行在本地的前端页面发送一个ajax请求访问后端API,然后浏览器报错blocked CORS policy. ...

  8. IE下IFrame引用跨域站点页面时,Session失效问题解决

    问题场景:在一个应用(集团门户)的某个page中, 通过IFrame的方式嵌入另一个应用(集团实时监管系统)的某个页面. 当两个应用的domain 不一样时, 在被嵌入的页面中Session失效.(s ...

  9. java springmvc 前端 跨域问题

    有个朋友在写扇贝插件的时候遇到了跨域问题.于是我对解决跨域问题的方式进行了一番探讨. 问题 API:查询单词URL: https://api.shanbay.com/bdc/search/?word= ...

随机推荐

  1. python web框架Flask——后台登录

    项目搭建 创建一个项目之后,需要在手动创建几个包(含有__init__.py文件的目录)和文件 1.在主目录下创建配置文件:config.py 2.在主目录下创建扩展文件:exts.py 3.在主目录 ...

  2. 「杂谈」最有可能成为第五个一线城市,苏州 or 杭州?

    最有可能成为第五个一线城市,苏州 or 杭州? 一线城市的几个硬指标 所谓的"一线城市",并不是政府提倡或者说是官方发布的城市称号,是最近十几年因房地产行业的强势崛起,一些媒体尤其 ...

  3. [20190520]exp imp on th fly.txt

    [20190520]exp imp on th fly.txt --//以前做的测试,查找浪费许多时间,做1个记录.--//注:仅仅linux 操作系统,bash shell版本不能太低就可以实现,现 ...

  4. JavaScript—图片与base64编码互相转换

    图片转换为base64编码 <input type = "file" id = "file" onchange="popFileName(thi ...

  5. Mysql—数据库管理与表管理

    数据库管理 表管理 删除表

  6. docker 简单介绍与安装

    主机虚拟化(vmware,visual box等) type-Ⅰ type=Ⅱ 主机虚拟化是隔离最彻底的,但是由于多隔了一个虚拟的操作系统,性能会慢一些. 容器虚拟化(docker等) 隔离没有主机虚 ...

  7. [PHP] 深度解析Nginx下的PHP框架路由实现

    所有的框架处理业务请求时,都会处理URL的路径部分,分配到指定的代码中去处理.实现这一功能的关键就是获取$_SERVER全局变量中对于URL部分的数据 当请求的路径为http://test.com/a ...

  8. Linux:quota磁盘配额设置

    磁盘配额的概念 quota 磁盘配额功能只在指定的文件系统(分区)内有效,未设置配额的文件系统不受限制. quota 针对指定的用户账号.组账号进行限制,其他用户或组不受影响. 磁盘配额可以进行两方面 ...

  9. awk常用命令

    1.统计TCP的连接数量,其中LISTEN多少个,ESTABLISHED多少个. [root@heiniao ~]# netstat -ant Active Internet connections ...

  10. mysql清空带外键的表

    set FOREIGN_KEY_CHECKS =0;TRUNCATE memo;TRUNCATE customer;set FOREIGN_KEY_CHECKS =1;