如何在內容安全策略到位時顯示視頻內容？

Question

我希望對此有一個簡單的答案。

我正在使用「fancybox」工具在頁面上嵌入來自Vimeo的視頻。 Fancybox實質上創建了一個iFrame並嵌入了Vimeo播放器。它在所有瀏覽器中都很好用 - 直到我打開內容安全策略。然後ID工作（因爲它沒有實現CSP），但Chrome和Firefox只是掛着顯示的「加載」圖像。

我已經試過這CSP：

<add header="Content-Security-Policy" value="default-src 'self'; media-src 'self' http://player.vimeo.com; frame-src 'self' http://player.vimeo.com; " /> 
<add header="X-Content-Security-Policy" value="default-src 'self'; media-src 'self' http://player.vimeo.com; frame-src 'self' http://player.vimeo.com; " /> 
<add header="X-WebKit-CSP" value="default-src 'self'; media-src 'self' http://player.vimeo.com; frame-src 'self' http://player.vimeo.com; " /> 

的思維，當然，是我允許媒體和我的iframe來還有Vimeo。但它不起作用。有誰知道爲什麼？

更新：我刪除了CSP只顯示視頻的頁面，並使用Google的開發人員工具查看了內容。事實證明，Vimeo從其他Vimeo子域名vimeocdn.com，conviva.com，lphbs.com甚至亞馬遜的aws中帶來了大量其他內容。所以 - 如果你使用Vimeo（和YouTube？），你有很長的外部網站列表，或者你不使用CSP？任何有識之士將不勝感激！

Answer 1

是的，最好的選擇是添加長長的主機列表，但不要刪除CSP！

根據您的政策，消除CSP將意味着以下幾點：

• 你允許內嵌腳本以及危險打電話對eval - 本質上開闢了另一個機會，體現/存儲XSS
• 框架可以從任何地方注入
• 圖像，樣式，小程序等可以從任何地方加載。

很多時候您需要允許內聯腳本/ evals，但內容安全策略仍然非常有效。

您還可以將報告頭部報告形式與report-uri結合使用，以收集您需要列入白名單的可能位置列表。