Question

我有一些代码可以显示来自远程源的HTML片段。

respDiv.children[i].innerHTML = '<iframe type="content" src="about:blank" style="height:300px;width:100%;border:none;"/>';
respDiv.children[i].children[0].contentDocument.write('<style> * {font-size:12px;}</style>'+untrustedHTML);

由于远程代码注入，插件被拒绝，所以我想知道是否有任何安全的方法可以做这样的事情？

Answer 1

如果您的iframe正在显示扩展中的页面而不是远程页面，那么您可能应该使用DOM构造方法来添加元素。 e.g。

respDiv.children[i].innerHTML = '<iframe type="content" src="about:blank" style="height:300px;width:100%;border:none;"/>';

更改为

var iframe = document.createElement("iframe");
iframe.setAttribute("type", "content");
iframe.setAttribute("src", "about:blank");
iframe.setAttribute("style", "height:300px;width:100%;border:none;");
respDiv.children[i].appendChild(iframe);

需要编写类似的代码来插入<style>元素。

但是，如果框架的src引用了一个远程页面，那么由于安全隐患，您可能很难获得批准。

Answer 2

您的扩展程序被拒绝了，因为使用您当前的代码，审核人员无法知道（并且无法保证）untrustedHTML的内容不会成为某些内容坏。它可能包含跟踪用户的脚本，或者窃取他们的登录信息，或者更糟。

解决方案是使用DOM方法插入此内容。这将确保您（和审核人员）知道将在iframe中放置的内容类型。例如，如果您的扩展程序只是插入文本，则可以执行以下操作：

respDiv.children[i].innerHTML = '<iframe type="content" src="about:blank" style="height:300px;width:100%;border:none;"/>';
respDiv.children[i].children[0].contentDocument.write('<style> * {font-size:12px; }</style>');
respDiv.children[i].children[0].contentDocument.appendChild(respDiv.children[i].children[0].contentDocument.createTextNode(textyouwanttoinsert));

如果内容包含的元素多于文本，那么您还需要使用DOM方法来创建这些元素。如果untrustedHTML非常复杂，您可能必须首先解析它，然后使用DOM方法插入它;只需确保您有一个有限的列表（元素，属性等），您插入。或者，将您的数据源设置为JSON或XML或其他内容，并从中将其转换为HTML。关键是，不要从数据源中获取HTML并将其放在网页中。

阻止Firefox插件，iframe中的权限升级的js代码

2 个答案: