如何允許內聯 JS 腳本使用 Nonce 進行 CSP

Question

我正在嘗試在我的網站上實施 CSP。 我經常更改我的內聯腳本，所以對於 CSP 來說，哈希對我來說是個壞主意

我讀到可以使用隨機整數的 Nonce 來實現 CSP。

我正在使用 WordPress。 下面是我的 CSP 標頭。

Header add Content-Security-Policy "default-src 'self'; script-src unsafe-hashes 'self' https://milyin.com https://cdnjs.cloudflare.com https://cdn.tiny.cloud  https:; object-src 'none';base-uri 'none';img-src https: data:;style-src 'self' 'unsafe-inline' https://fonts.googleapis.com https://www.google.com https:;report-uri https://milyin.com/?csp=true"

正如您可能知道的那樣，內聯腳本不會從中執行。 那么如何實現呢。

最初的研究讓我發現了哈希的想法，而且我可以從 chrome 開發工具中獲取腳本的哈希這一事實使它變得簡單明了。

但是，對任何腳本進行最輕微的更改都會要求我更改哈希，這一事實令人頭疼。

所以我聽說了nonce。

請建議如何實現它，並（如果可能）告訴他們是否存在像我這樣的 wordpress 用戶更簡單的方法。

所以我有幾個疑問：

1. 什么是隨機數？ 據我了解，這是我喜歡的隨機整數。

2. 我可以使用相同的 nonce 所有腳本嗎？ 我的意思是我可以說Header add Content-Security-Policy "default-src 'self'; script-src 'self' 'nonce-69'然后把<script nonce="69"放在我網站的每個腳本中?

3. 我需要經常更改 Nonce 嗎？ 我的意思是如果 Nonce 是恆定的，那么有人可以簡單地使用相同的 nonce 放置注入腳本並讓它工作。 如何防止這種情況。

Answer 1

1.) 什么是隨機數？ 據我了解，這是我喜歡的隨機整數。

Nonce 是 base64 編碼值：

; Nonces: 'nonce-[nonce goes here]'
nonce-source  = "'nonce-" base64-value "'"
base64-value  = 1*( ALPHA / DIGIT / "+" / "/" / "-" / "_" )*2( "=" )

2.) 我可以使用相同的 nonce 所有腳本嗎？ 我的意思是我可以說 Header add Content-Security-Policy "default-src 'self'; script-src 'self' 'nonce-69' 然后把 <script nonce="69" 放在我網站的每個腳本中?

是的，您可以使用一次生成的隨機數，而無需為頁面上的每個腳本生成一個新的隨機數。
要生成隨機數，您可以使用：

• Apache web-server 的mod_cspnonce
• NGINX 1.11.0+ web-server 的$request_id變量

3.) 我需要經常更改 Nonce 嗎？ 我的意思是如果 Nonce 是恆定的，那么有人可以簡單地使用相同的 nonce 放置注入腳本並讓它工作。 如何防止這種情況。

根據CSP 規范，服務器每次傳輸策略時都必須生成一個唯一的 nonce 值。 生成的值應至少為 128 位長（編碼前），並且應通過密碼安全的隨機數生成器生成，以確保攻擊者難以預測該值。
這意味着您必須在每個頁面加載時重新生成一個隨機數。

順便說一句，你有一個錯誤... script-src unsafe-hashes 'self' ... - unsafe-hashes標記應該是一個單引號： 'unsafe-hashes' 。 但無論如何它沒有用，因為 Safari 不支持它。

Answer 2

必須為每個頁面加載生成一個唯一的 nonce推出基於 nonce 的 CSP 的架構通常用於自定義 Web 應用程序 - 對於 Wordpress 網站來說會非常復雜，因為我想您可能正在使用 Caching / CDN。

我建議保留 Wordpress 網站的'unsafe-inline' 。 如果您有其他更重要的頁面（如結帳頁面/管理頁面），您可以創建一個單獨的 CSP。

話雖如此，如果您繼續使用 nonces 實現 CSP，您可能需要添加'strict-dynamic'和'unsafe-eval'權限。

Answer 3

我寫了一個小類來生成標題和隨機數以供以后使用。 CspBuilder類的每個構造都將創建一個唯一的隨機數，供以后使用。 只要腳本在 .php 文件中被引用，這將起作用：

$Csp = (new \CspBuilder(true))
    -> addCspPolicyNonce(CspDirective::Script)
    -> setCspHeader();

setCspHeader() 的副作用是生成完整的Content-Security-Policy 。 在 PHP 文件中包含腳本的任何地方都使用：

<script nonce="<?=$Csp->getNonce?>">

在這個經過全面類型檢查的小型類中還有更多選項。 閱讀說明或代碼。 鏈接在這里： https ://github.com/theking2/php-csp-builder