iframe跨域问题:Uncaught DOMException: Blocked a frame with origin解决方法

时间:2021-11-14 04:50:18

在前后端分离的情况下,前台页面将后台页面加载在预留的iframe中;但是遇到了iframe和主窗口双滚动条的情况,由此引申出来了问题:

  只保留单个滚动条,那么就要让iframe的高度自适应,而从主页面显然直接取不到iframe的值,因为这是跨域的(前台页面与后台页面不在同一个IP地址或者同一个端口),尝试访问会报错:

  Blocked a frame with origin "http://7.35.0.8:8080" from accessing a frame with origin "http://7.35.0.9:8080".Protocols, domains, and ports must match.

  解决方案如下: 

  
iframe跨域问题:Uncaught DOMException: Blocked a frame with origin解决方法
//主页面 向 iframe传递事件

//主页面

var frame = document.getElementById('iframeId');
frame.contentWindow.postMessage(object,'*'); //iframe页面
iframe: window.addEventListener('message',function(event){
//此处执行事件
})
iframe跨域问题:Uncaught DOMException: Blocked a frame with origin解决方法
iframe跨域问题:Uncaught DOMException: Blocked a frame with origin解决方法
//iframe向主页面传递事件

//iframe页面
window.parent.postMessage(object,'*'); //主页面
window.addEventListener('message',,function(event){
//此处执行事件
})
iframe跨域问题:Uncaught DOMException: Blocked a frame with origin解决方法

亲测解决,ok的。

iframe跨域问题:Uncaught DOMException: Blocked a frame with origin解决方法的更多相关文章

  1. 跨域问题 Uncaught DOMException: Blocked a frame with origin。。。

    第三方系统内嵌 到iframe中的 跨域问题. 解决方案: http://www.ruanyifeng.com/blog/2016/04/same-origin-policy.html

  2. 跨域打开页面:Uncaught DOMException: Blocked a frame with origin

    Uncaught DOMException: Blocked a frame with origin 使用postMessage()方法可以解决跨域传值的问题 Api: https://develop ...

  3. Uncaught DOMException: Blocked a frame with origin "http://localhost

    ajaxFileUpload上传时报错 :Uncaught DOMException: Blocked a frame with origin "http://localhost..... ...

  4. 【运行错误】Uncaught DOMException: Blocked a frame with origin "null" from accessing a cross-origin frame.

    代码如下: <html> <head> <script> /*window.frames[]可以通过下标或名称访问单独的frame*/ window.onload= ...

  5. iframe框架自适应高度 uncanght SecurityError&colon; Blocked a frame with origin &quot&semi;null&quot&semi; from accessing a frame &period;&period;&period;&period;

    来源于crm项目的contact/edit.html 一.背景是这样的 最近在做crm系统的前端页面,有一个页面呢,点击“查看全部信息”时会弹出,这个弹窗里面又有分页导航,分页不是使用ajax 异步刷 ...

  6. 页面跨域与iframe通信&lpar;Blocked a frame with origin&rpar;

    项目中有个需求是在前后端分离的情况下,前台页面将后台页面加载在预留的iframe中:但是遇到了iframe和主窗口双滚动条的情况,由此引申出来了问题: 只保留单个滚动条,那么就要让iframe的高度自 ...

  7. 【HTML】iframe跨域访问问题

    概述 本地同一浏览器访问本地HTML文件和访问服务器端HTML文件,本地Iframe没有自适应高度,而服务器端的Ifrane自适应了高度. 1.问题重现: Chrome 版本 41.0.2272.10 ...

  8. CP&equals;&quot&semi;CAO PSA OUR&quot&semi; 用P3P header解决iframe跨域访问cookie

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

  9. 跨域问题 Blocked a frame with origin &quot&semi;http&colon;&sol;&sol;&period;&period;&period;&period;&period;&period;&quot&semi; from accessing a cross-origin frame&period;

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

随机推荐

  1. CS0016&colon; 未能写入输出文件&OpenCurlyDoubleQuote;c&colon;&bsol;Windows&bsol;Microsoft&period;NET&bsol;Framework&bsol;v2&period;0&period;50727&bsol;Temporary ASP&period;NET Files&bsol;root&bsol;f834824f&bsol;75776659&bsol;xxx&period;dll”--&OpenCurlyDoubleQuote;拒绝访问。 ”

    解决方法: 1.找到C:\windows\Temp文件夹 右键属性-->安全选项卡,给IIS_IUSRS帐号赋予权限

  2. Fatal error&colon; Allowed memory size of 134217728 bytes exhausted &lpar;tried to allocate 44 bytes&rpar; in

    最近莫名出现这个错误. 研究一下原因很奇葩呢. 原因:sql获取数据库中数据,取出数据赋给变量,数据太多,超过memory_limit内存设置了. 解决方法:设置memory_limit不建议.优化代 ...

  3. Licode Install CentOS 7&period;0

    mysqldump --add-drop-table -uroot -p123456 jit >/extra_disk/jit.sql sudo npm install -g node-gyp ...

  4. Java-NIO(七):阻塞IO与非阻塞IO

    阻塞IO 传统的 IO 流都是阻塞式的. 也就是说,当一个线程调用 read() 或 write()时,该线程被阻塞,直到有一些数据被读取或写入,该线程在此期间不能执行其他任务. 因此,在完成网络通信 ...

  5. Python基础&plus;模块、异常

    date:2018414+2018415 day1+2 一.python基础 #coding=utf-8 #注释 #算数运算 +(加)  -(减)  *(乘)  /(除)  //(取整)  %(取余) ...

  6. mysql8&period;0驱动问题

    <dependency> <groupId>mysql</groupId> <artifactId>mysql-connector-java</a ...

  7. python- 日志学习

    # @File : learn_logging.py #-*- coding:utf-8 -*- """ 日志:log 记录代码执行的过程 一旦记录下来,就可以根据日志去 ...

  8. Setting up Unicorn with Nginx

    gem install unicorn or gem 'un*n' 1 install Nginx yum install ... 2 Configuration vi /etc/nginx/n ...

  9. &lpar;笔试题&rpar;删除K位数字

    题目: 现有一个 n 位数,你需要删除其中的 k 位,请问如何删除才能使得剩下的数最大? 比如当数为 2319274, k=1 时,删去 2 变成 319274 后是可能的最大值. 思路: 1.贪心算 ...

  10. Java GC垃圾回收

    Java的内存分配和回收也主要在Java的堆上进行的,Java的堆中存储了大量的对象实例,所以Java的堆也叫GC堆. Java在垃圾收集的过程中,主要用到了分代收集算法,具体有复制.标记清除.标记压 ...