解决：Uncaught DOMException: Blocked a frame with origin “xxx“ from accessing a cross-origin frame.
丑话说在前头：觉得我写的不错，记得点赞+收藏+分享，觉得我写得不行，欢迎留言！
最近在写一个项目：需要在页面使用iframe来播放老大写好的动画播放器，突然报这种错误：
老大说：这错误太明显了，就是跨域问题。
原来，浏览器地址是https://www.xxx.com，但是在iframe中，src属性值为https://xxx.com，我将src属性值改为https://www.xxx.com，问题就解决了！
“iframe跨域”可能造成无法与父页面通信，无法修改iframe元素样式等问题。
既然被老大质疑我对“跨域”的知识了解多少，那我们就来简单复习一下吧！
讲到跨域，我们应该首先了解“同源策略”。
“同源策略是一个重要的安全策略，它用于限制一个origin的文档或者它加载的脚本如何能与另一个源的资源进行交互。它能帮助阻隔恶意文档，减少可能被攻击的媒介。
如果两个 URL 的 protocol、port (如果有指定的话)和 host 都相同的话，则这两个 URL 是同源。这个方案也被称为“协议/主机/端口元组”，或者直接是 “元组”。（“元组” 是指一组项目构成的整体，双重/三重/四重/五重/等的通用形式）。”
以上内容摘自“MDN：同源策略”
不符合"同源策略"规则的场景，即为“跨域”，跨域的解决方案在上面的链接中有提到，自行查阅！
又水了一篇文章，记得点赞+收藏+分享，或者留言，谢谢！
解决：Uncaught DOMException: Blocked a frame with origin “xxx“ from accessing a cross-origin frame.相关推荐
- JS Uncaught DOMException: Blocked a frame with origin “XXX“ from accessing a cross-origin frame问题解决
问题描述: Uncaught DOMException: Blocked a frame with origin "http://localhost:46819" from acc ...
- iframe 父页面全屏同时子页面 viewer轮播插件全屏放大 Uncaught DOMException: Blocked a frame with origin null from acce
1.在父页面<iframe allowfullscreen="true" ></iframe> 标签要加上 allowfullscreen="tr ...
- Blocked a frame with origin XXX from accessing a cross-origin 跨域问题解决方案
本文示例使用的 html vue ckeditor4 场景说明 项目是一个比较老的项目,需要使用ckeditor4来进行步骤填写,商议后使用jsp内iframe一个vue的html页面进行编写,但是在 ...
- Blocked a frame with origin XXX from accessing a cross-origin 。iframe跨域问题
在前端开发的过程中,我们常常会用到iframe去在我们的页面中引用一个子页面,而父子页面又常常会有交互.在同域情况下,子页面如果想要访问父页面中的window对象中的方法的话,直接在当前页面中使用wi ...
- Access to script at ‘xxx‘ from origin ‘null‘ has been blocked by CORS policy: Cross origin requests
前言 本地调试js时,遇到本错误 Google Chrome 84.0.4147.135 (正式版本) (64 位) (cohort: Stable Installs Only) 修订版本 c42bd ...
- js base64解码JWT失败：VM273:1 Uncaught DOMException: Failed to execute 'atob' on 'Window': The string to
前端获取后端服务生成JWT,利用js方法base64解码payload段: window.atob("eyJzdWIiOiJ0ZXN0MyIsInVzZXJJZCI6IjEwMTY5MiIs ...
- 解决Cross origin requests are only supported for protocol schemes问题
解决Cross origin requests are only supported for protocol schemes问题 问题描述 本前端小白在学习的时候尝试按照一个网上的blog的代码来跑 ...
- ajax跨域请求问题：Access to XMLHttpRequest at……has been blocked by CORS policy: Cross origin requests
背景:本地代码调试时,加载本地资源正常,jquery的AJAX请求服务端资源报错. Access to XMLHttpRequest at '***** ' from origin 'null' ha ...
- 头像裁剪和Uncaught DOMException: Failed to execute ‘toDataURL‘ on ‘HTMLCanvasElement‘: Tainted canvases m
此文是半原创. 头像裁剪的主要实现是同事找来发我的,用着还不错. 记一下,可以用作以后研究. 此文主要记录一个要点: 当用户上传已上传头像,裁剪头像弹窗获取到图片,当调用canvas的toDataUR ...
最新文章
- python使用imbalanced-learn的SMOTEENN方法同时进行上采样和下采样处理数据不平衡问题
- 怎么才能转入大数据领域 ，成为一名合格的大数据分析师...
- 解决paramiko获取远程脚本延时返回数据的问题
- public medical image database
- 剑指offer之C语言实现链表（两种方式）
- php点击后增加html元素,如何动态生成html元素以及为元素追加属性的方法介绍（附代码）...
- 前端学习（1759）：前端调试值之调试安卓设备的方法
- 图tp delDataById问题
- safari使用canvas引入域外的图片
- The Breakpoint will not currently be hit. No executable code associated with this line
- php smarty配置文件,Smarty配置文件
- 在Myeclipse中创建自定义用户类库
- 自建网盘教程之：使用可道云搭建私有云网盘，无需数据库，windows操作界面
- 中国大湾区经济推动新全球化时代
- 前端开发 html第三课 列表 超链接 相对路径 图片
- deepfool简单实现
- 快递查询API接口对接案例（顺丰、圆通、中通、德邦、天天）
- 华硕主板刷机后不能进入Windows的解决办法
- 2019年终总结——我度过了幸福的一年
- 深入拆解类加载器，这样的姿势你还不懂吗？