尝试呈现i帧：祖先违反了以下内容安全策略指令：“frame-ancestors'none'”
我想呈现一个iframe的来源是Github像这样：
<iframe src="https://gist.github.com/user45445/9bf8d568e3350146ba302d7d67ad576f"> </iframe> 这是我在控制台中得到的错误： Refused to display 'https://gist.github.com/fresh5447/9bf8d568e3350146ba302d7d67ad576f' in a frame because an ancestor violates the following Content Security Policy directive: "frame-ancestors 'none'".
我正在研究如何在我的Node服务器中指定我的Content Security Policy ，指定它应该接受来自github任何iframe
所以我安装了csp-helmet，并将其添加到我的服务器代码中：
var csp = require('helmet-csp') app.use(csp({ // Specify directives as normal. directives: { frameAncestors: ['*.github.com'], //I thought these two did the same, so I tried them both. childSrc: ['*.github.com'] }, // Set to true if you only want browsers to report errors, not block them. // You may also set this to a function(req, res) in order to decide dynamically // whether to use reportOnly mode, eg, to allow for a dynamic kill switch. reportOnly: false, // Set to true if you want to blindly set all headers: Content-Security-Policy, // X-WebKit-CSP, and X-Content-Security-Policy. setAllHeaders: false, // Set to true if you want to disable CSP on Android where it can be buggy. disableAndroid: false, // Set to false if you want to completely disable any user-agent sniffing. // This may make the headers less compatible but it will be much faster. // This defaults to `true`. browserSniff: true }))
但还是一样的错误..
我一直在试图看官方文档和HTML5岩石指南
不知道我是超级密切还是采取完全错误的做法。
更新
我也尝试通过meta标签设置CSP。
<meta http-equiv="Content-Security-Policy" content="child-src https://gist.github.com; frame-ancestors https://gist.github.com;">
比我收到这个错误：
Content Security Policies delivered via a <meta> element may not contain the frame-ancestors directive.
提前致谢。
frame-ancestors值对iframe的来源起作用，而不是构成它的文档。 在页面上设置CSP将不会对组帧造成影响。 在类固醇上考虑frame-ancestors如X-Frame-Options ：它限制什么是允许框架的内容。 Gist故意不允许直接构图，而是提供embeddedGist的方法。
frame-ancestors 'none' == X-Frame-Options: DENY
如oreoshake指出，这里的问题不是你的CSP，而是GitHub上的CSP。 这是GitHub，阻止你框架，所以你没有什么可以做你的CSP来解决这个问题。