解决:Uncaught DOMException: Blocked a frame with origin “xxx“ from accessing a cross-origin frame.
同源策略是一个重要的安全策略,它用于限制一个origin的文档或者它加载的脚本如何能与另一个源的资源进行交互。它能帮助阻隔恶意文档,减少可能被攻击的媒介。如果两个 URL 的protocol、port(如果有指定的话)和host都相同的话,则这两个 URL 是同源。这个方案也被称为“协议/主机/端口元组”,或者直接是“元组”。(“元组” 是指一组项目构成的整体,双重/三重/四重/五重/等的通用形式
丑话说在前头:觉得我写的不错,记得点赞+收藏+分享,觉得我写得不行,欢迎留言!
最近在写一个项目:需要在页面使用iframe来播放老大写好的动画播放器,突然报这种错误:
老大说:这错误太明显了,就是跨域问题。
原来,浏览器地址是https://www.xxx.com,但是在iframe中,src属性值为https://xxx.com,我将src属性值改为https://www.xxx.com,问题就解决了!
“iframe跨域”可能造成无法与父页面通信,无法修改iframe元素样式等问题。
既然被老大质疑我对“跨域”的知识了解多少,那我们就来简单复习一下吧!
讲到跨域,我们应该首先了解“同源策略”。
“同源策略是一个重要的安全策略,它用于限制一个origin的文档或者它加载的脚本如何能与另一个源的资源进行交互。它能帮助阻隔恶意文档,减少可能被攻击的媒介。
如果两个 URL 的 protocol、port (如果有指定的话)和 host 都相同的话,则这两个 URL 是同源。这个方案也被称为“协议/主机/端口元组”,或者直接是 “元组”。(“元组” 是指一组项目构成的整体,双重/三重/四重/五重/等的通用形式)。”
以上内容摘自“MDN:同源策略”
不符合"同源策略"规则的场景,即为“跨域”,跨域的解决方案在上面的链接中有提到,自行查阅!
又水了一篇文章,记得点赞+收藏+分享,或者留言,谢谢!
更多推荐
所有评论(0)