【IT】CSP, Content Security Policy(內容安全策略)是什麼?設定
2024/11/13 突然被派了一個任務，要把 A頁面移到猛另一個功能底下，
並且前端規格要改成 default-src ‘self’、style-src ‘self’、script-src ‘self’
這個還是第一次看到，想說來記錄一下
Content Security Policy 是什麼?
Content Security Policy(內容安全策略)是一個電腦安全標準，防止跨站腳本攻擊(XSS)，限制外部資料的使用，告訴瀏覽器說有哪些資源可以使用(白名單)，瀏覽器就會像保鑣一樣幫你過濾客人，因為我們無法預期客人會帶來什麼風險，可以有避免網路攻擊，提高安全性
屬性
default-src ‘self’ 只允許自身網站的 js, css, font, img 等等。
script-src ‘self’ 只允許自身網站的 js
style-src ‘self’ 只允許自身網站的 css
怎麼設定
在設定 Content Security Policy (CSP) 時，可以在 HTTP Header 或 HTML 中的 <meta> 標籤內設定。CSP 的基本概念是指定哪些資源允許被載入，藉此提高網站的安全性。以下是幾種常見的設定範例：
方法一：使用 HTTP Header 設定
在伺服器端設置 CSP header，例如在 Apache 或 Nginx 的設定檔中，加入以下設定：
Apache：
<IfModule mod_headers.c>
Header set Content-Security-Policy “default-src ‘self’; script-src ‘self’ https://example.com; style-src ‘self’ ‘unsafe-inline’; img-src ‘self’ data: https://example.com;”
</IfModule>
Nginx：
add_header Content-Security-Policy “default-src ‘self’; script-src ‘self’ https://example.com; style-src ‘self’ ‘unsafe-inline’; img-src ‘self’ data: https://example.com;”;
方法二：在 HTML <meta> 標籤內設定
如果無法修改伺服器端設定，可以將 CSP 直接放在 HTML 的 <meta> 標籤中：
<meta http-equiv=”Content-Security-Policy” content=”default-src ‘self’; script-src ‘self’ https://example.com; style-src ‘self’ ‘unsafe-inline’; img-src ‘self’ data: https://example.com;”>
範例解釋
• default-src ‘self’: 預設來源限制為自身網站。
• script-src ‘self’ https://example.com: 限制 JavaScript 的來源為自身網站和 https://example.com。
• style-src ‘self’ ‘unsafe-inline’: 限制樣式的來源為自身網站，允許內嵌樣式（不推薦，但某些情況下必須使用）。
• img-src ‘self’ data: https://example.com: 限制圖片來源為自身網站、Data URLs 和 https://example.com。
注意事項
1. 使用 self：指允許當前來源的資源。
2. 避免 unsafe-inline 和 unsafe-eval：這些指令可能帶來安全風險，應謹慎使用。
3. 逐步調整政策：建議先使用 Content-Security-Policy-Report-Only 來測試設定，這樣可以避免因為過於嚴格的策略導致網站無法正常運行。
參考資料
- https://zh.wikipedia.org/zh-tw/%E5%86%85%E5%AE%B9%E5%AE%89%E5%85%A8%E7%AD%96%E7%95%A5
- https://ithelp.ithome.com.tw/articles/10307460
- https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Content-Security-Policy/default-src
- https://blog.darkthread.net/blog/csp-script-src/
本文部分由 ChatGPT 產生
