CSP
content-security-policy
主要是用於阻擋 Cross-Site Scripting (XSS) 攻擊
可以要求瀏覽器是否允許那些網域的 css/js 可以使用、inline js/css 能否使用
看範例
Yahoo 股市的 CSP
完整content-security-policy-report-only: connect-src 'self' https://*.yahoo.com https://*.yimg.com https://*.adaptv.advertising.com https://tpc.googlesyndication.com https://edgecast-vod.yahoo.net https://ad.doubleclick.net; default-src 'self' https://*.yahoo.com https://s.yimg.com; font-src 'self' https://*.yahoo.com https://s.yimg.com; frame-src 'self' https://*.yahoo.com https://s.yimg.com; img-src 'self' data: https:; media-src https://edgecast-vod.yimg.com blob:; script-src 'self' 'unsafe-eval' 'unsafe-inline' https://*.yahoo.com https://s.yimg.com https://consent.cmp.oath.com https://www.gstatic.com https://s.update.wtag.adaptv.advertising.com; style-src 'self' 'unsafe-inline' https://s.yimg.com; worker-src 'self' https://*.yahoo.com blob:; frame-ancestors https://*.yahoo.com https://*.yahoo.net https://*.yahoo.com.tw https://*.yahoo.com.hk https://*.yahoodns.net https://tw.discount.yahoo.net; report-uri https://csp.yahoo.com/beacon/csp?src=td-app-stock content-security-policy: frame-ancestors https://*.yahoo.com https://*.yahoo.net https://*.yahoo.com.tw https://*.yahoo.com.hk https://*.yahoodns.net https://tw.discount.yahoo.net;
content-security-policy:
frame-ancestors https://*.yahoo.com https://*.yahoo.net https://*.yahoo.com.tw https://*.yahoo.com.hk https://*.yahoodns.net https://tw.discount.yahoo.net;
content-security-policy-report-only:
default-src 'self' https://*.yahoo.com https://s.yimg.com;
* self 允許"自己同域名" 可以引用相關檔案(如 script/css/websocket )
* 僅允許 *.yahoo.com 、s.yimg.com
一般只要設定一行 Content-security-policy: default-src 'self' 'unsafe-inline' http://*.網域;
就可解決大部分的問題，若 script、font、css... 等檔案有各自不同的來源，可額外設定下面細項
connect-src 'self' https://*.yahoo.com https://*.yimg.com https://*.adaptv.advertising.com ...還有3個網址 略過..;
* self 允許自己同域名可以連接 websocket
* 僅允許相關的網域可連接 websocket
font-src 'self' https://*.yahoo.com https://s.yimg.com;
* 允許從那些地方下載字型檔案
frame-src 'self' https://*.yahoo.com https://s.yimg.com;
* 允許那些網址可以 iframe。若是 frame-src 'none' 表示禁止 iframe
img-src 'self' data: https:;
* 允許任何 https:// 的網址圖片
* data: 指允許顯示 base64 圖片，如 data:image/jpeg;base64,iVBORw0KGgoAAA....
media-src https://edgecast-vod.yimg.com blob:;
* <audio>和<video>可以使的網站來源
script-src 'self' 'unsafe-eval' 'unsafe-inline' https://*.yahoo.com https://s.yimg.com ...還有3個網址略過..;
* unsafe-eval = 允許執行 eval() 函數
* unsafe-inline = 允許執行 HTML 內的 <script>...</script>
例如部落格會開放用戶寫 <script>...</script> 若要允許執行這寫 script，就要加上 unsafe-inline
* 允許載入 *.yahoo.com + s.yimg.com 的 script
style-src 'self' 'unsafe-inline' https://s.yimg.com;
* unsafe-inline = 允許 HTML 內的 css 語法可以作用
* 允許載入 s.yimg.com 的 css 檔案
worker-src 'self' https://*.yahoo.com blob:;
* Web Worker 沒研究過這
frame-ancestors https://*.yahoo.com https://*.yahoo.net https://*.yahoo.com.tw ...還有3個網址略過..;
* 相關 <frame> <iframe> <object> <embed> <applet>
report-uri https://csp.yahoo.com/beacon/csp?src=td-app-stock
* 對於違反CSP的，瀏覽器會自動回報到哪個網址
GMail 的 CSP
contContent-security-policy script-src https://www.google.com/js/bg/ 'self' 'unsafe-inline' 'unsafe-eval' https://mail.google.com/_/scs/mail-static/ https://*.googleusercontent.com/confidential-mail/attachments/ ...還有幾網址略過..;; report-uri https://mail.google.com/mail/cspreport; object-src https://mail-attachment.googleusercontent.com/attachment/, script-src 'nonce-CzZGaWr9crvlhKAO2iKRrg' 'unsafe-inline' 'strict-dynamic' https: http: 'unsafe-eval'; object-src 'none';base-uri 'self'; report-uri https://mail.google.com/mail/cspreport
content-security-policy 與 content-security-policy-report-only 差別
content-security-policy 執行 CSP 相關規則、阻擋非法的檔案、語法
content-security-policy-report-only 僅做 report-uri 通知，不會實際做 CSP 的阻擋動作，適用於驗證自己寫的 CSP 規則是正確後，再貼到 content-security-policy 中
report-uri
瀏覽器會回報 json 資料，格式：
{
"csp-report": {
"document-uri": "http://example.com/signup.html",
"referrer": "",
"blocked-uri": "http://example.com/css/style.css",
"violated-directive": "style-src cdn.example.com",
"original-policy": "default-src 'none'; style-src cdn.example.com; report-uri /_/csp-reports",
"disposition": "report"
}
}
參考資料
<?php
//php 接收CSP report 的寫法：
$data = json_decode(file_get_contents('php://input'), true);
var_dump($data);
$blocked_uri = $data["csp-report"]['blocked-uri'];
$document_uri = $data["csp-report"]['document-uri'];
$referrer = $data["csp-report"]['referrer'];
$original_policy = $data["csp-report"]['original-policy'];
$violated_directive = $data["csp-report"]['violated-directive'];
?>
https://devco.re/blog/2014/04/08/security-issues-of-http-headers-2-content-security-policy/
https://hackmd.io/@Eotones/BkOX6u5kX
https://ithelp.ithome.com.tw/articles/10223568
https://cloud.tencent.com/developer/chapter/13541
