尝试在Chrome扩展程序中加载第三方wysiwyg编辑器时出现以下错误。
沙盒访问冲突:阻止了一个框架 “chrome-extension:// cmcjindomengjienigbcldekcfnhfped”访问 框架在“null”。两个框架都是沙盒,缺少框架 “允许同源”旗帜。
我最初遇到了类似的错误,并设法通过添加 allow-same-origin 标志来解决它。这导致另一个错误,需要允许脚本标志。以下是iframe元素的当前状态
<iframe sandbox="allow-same-origin allow-scripts" src="editor.html" width="350" height="350" style="border:none;"></iframe>
wysiwyg编辑器动态创建一个iframe来保存编辑器。我假设这可能会触发错误的第二个实例。我尝试在沙盒页面中创建的iframe上设置 allow-same-origin 标志,但这没有做任何事。
我可以尝试另类,但是,这也是一个学习冒险,我很乐意解决这个问题。
修改 我尝试用div替换动态创建的iframe只是为了看看会发生什么。我没有得到上面的错误,但正如预期的那样,当访问与iframe相关的属性时代码失败。这并不能证明新的iframe是问题,但确实可以。
编辑2 FWIW,下面的行是引发错误的地方
this.e = this.i.contentWindow.document;
我以前初始化为
this.i = document.createElement('iframe');
答案 0 :(得分:2)
如果您对iframe进行沙盒处理,则无法从外部访问该内容。然后,您应该使用postMessage在用户代理之间进行通信。
通过在同一域上加载的iframe上同时使用allow-same-origin和allow-scripts,iframe可以删除沙盒属性。
当嵌入页面与包含iframe的页面具有相同的原点时,将allow-scripts和allow-same-origin关键字一起设置允许嵌入页面简单地删除sandbox属性然后重新加载自身,从而有效地突破沙箱一共。