是否可以阻止远程脚本加载到 iframe 中？

Question

我正在动态创建 iframe，我想阻止并非源自 iframe 来源的脚本。这甚至可能吗（通过 JavaScript/jQuery）？例如，如果我的页面从 example.com 加载一个 iframe，其内容为：

<script src="http://example.com/foo.js"></script>
<script src="http://something-else.com/bar.js"></script>

我希望 example.com 脚本到运行，但我希望 something-else.com 脚本被阻止而不是运行。

我正在使用 NW.js（以前称为 Node-Webkit），因此我对 iframe 的内容具有完全的读写访问权限，就好像它们是同源的一样。

我试过使用插件（比如那些在图片中引入 CORS，带有白名单的插件），但我试过的都没有用。

除了 iframe 的来源之外，理想的解决方案还允许我将特定的其他来源列入白名单。

编辑：

这是我的浏览器项目，我试图在以下位置实现它：https://github.com/IdeasNeverCease/Aries

这是加载 iframe 的代码部分：https://github.com/IdeasNeverCease/Aries/blob/master/app.nw/resources/scripts/aries.js#L376-L687

Answer 1

I want to prevent scripts that don't originate from the iframes' source

这正是 Content Security Policy (CSP) 的用途。 CSP 可以指定脚本、插件、样式、媒体等允许哪些来源。您需要使每个 iframe 都有一个 CSP，以防止脚本加载到当前来源之外；这可以通过简单的策略 script-src 'self' 'unsafe-inline'; 来完成（unsafe-inline 允许 iframe 具有内联脚本，而 self 仅限制对 same-origin 资源的加载）

传统上，您需要服务器在提供页面时发送 Content-Security-Policy 响应 header。但是，如果您无法控制 server-sent 响应 header（但 do 可以控制页面内容），您可以模仿 HTTP 响应 header 带有 <meta> 标签，如下所示：

<meta http-equiv="Content-Security-Policy" content="script-src 'self' 'unsafe-inline';">

您可以通过编程方式注入（但请继续阅读以了解问题）：

var m = document.createElement("meta");
m.httpEquiv = "content-security-policy";
m.content = "script-src 'self' 'unsafe-inline';";
iframeElem.contentDocument.documentElement.appendChild(m);

但是，此 script-based 注入可能对您不起作用，因为在 DOM 从 HTML 来源。届时，来自任何（非async）<script> 元素的脚本将已经被提取并且运行。您可能需要直接操作 HTML，但我对 NW.js 的了解还不够多，无法告诉您最好的方法。

如果你想禁止所有个外部脚本资源（即使是同源的），你可以使用script-src 'none' 'unsafe-inline';。要禁止所有脚本，包括加载的脚本和内联脚本，请使用 script-src 'none';

为了将特定来源列入白名单，只需将它们添加为 CSP 中未引用的项目：

Content-Security-Policy: script-src 'self' *.twitter.com https://api.facebook.com

前导 *. 允许所有子域，前导 https:// 限制该域的白名单以仅保护 https:// 地址。

是否可以阻止远程脚本加载到 iframe 中？

Is it possible to block remote scripts from loading inside iframe?

javascript

jquery

iframe

node-webkit