拒绝构建&https://www.youtube.com/embed/xxxxx,因为它违反了内容安全政策指令

时间:2017-02-07 14:50:45

标签: google-chrome firefox youtube content-security-policy

我想在我的页面中嵌入一个YouTube视频,并在控制台中看到如下错误:

Refused to frame 'https://www.youtube.com/embed/<~videoId~>?showinfo=0'
because it violates the following Content Security Policy directive: 
"default-src 'self'". Note that 'frame-src' was not explicitly set, so 
'default-src' is used as a fallback.

这看起来很清楚,所以经过一些阅读后,我找到了两种设置适当内容安全策略的方法。

  1. 通过设置响应标头(我在我的web.config文件中执行):

    <httpProtocol>
      <customHeaders>
        <add name="Content-Security-Policy" value="frame-src https://www.youtube.com/" />
      </customHeaders>
    </httpProtocol>
    
  2. 在页眉中添加了元标记:

    <meta http-equiv="Content-Security-Policy" content="frame-src https://www.youtube.com">
    
  3. 这些方法都不奏效; Chrome继续在控制台中提供相同的结果(即使我已经完成了我认为的消息意味着并设置了所请求的内容安全策略)。 iframe仍然被阻止并且为空。

    关于内容安全政策有很多问题和答案,但在这种情况下,我找不到任何问题和答案。

    我的网站在https上运行,我的iframe和嵌入式视频如下所示:

    <div id="videoContainer">
        <iframe src="https://www.youtube.com/embed/<~videoId~>?showinfo=0"
                frameborder="0"
                allowfullscreen>
        </iframe>
    </div>
    

    问题只出现在Chrome和FFirefox上;没有内容安全策略,Internet Explorer 11就可以了。

    提前感谢任何建议。

1 个答案:

答案 0 :(得分:1)

我自己找到了答案。我试图在Identity Server 3安装的登录页面上嵌入一个视频,这比我想象的更大。

Chrome网络标签包含来自Identity Server的csp报告,从中快速搜索的线索在Identity Server文档中显示了答案:     https://identityserver.github.io/Documentation/docsv2/advanced/csp.html

在身份服务器选项中添加cspOptions条目修复了整个问题,而无需我添加任何自己的自定义标题:

var options = new IdentityServerOptions
{
    SigningCertificate = Certificate.Load(),
    Factory = factory,
    RequireSsl = true,
    CspOptions = new CspOptions() {FrameSrc = "https://www.youtube.com"},
              ...
              ...
 }