diff --git a/docs/content/1.documentation/2.headers/1.csp.md b/docs/content/1.documentation/2.headers/1.csp.md index 0379afa5..1b63ef22 100644 --- a/docs/content/1.documentation/2.headers/1.csp.md +++ b/docs/content/1.documentation/2.headers/1.csp.md @@ -215,15 +215,6 @@ export default defineNuxtConfig({ - `"'nonce-{{nonce}}'"` placeholder: Include this value in any individual policy that you want to be governed by nonce. -::alert{type="warning"} -Our default recommendation is to avoid using the `"'nonce-{{nonce}}'"` placeholder on `style-src` policy. -
-⚠ This is because Nuxt's mechanism for Client-Side hydration of styles could be blocked by CSP in that case. -
-For further discussion and alternatives, please refer to our [Advanced Section on Strict CSP](/documentation/advanced/strict-csp). -:: - - _Note: Nonce only works for SSR. The `nonce` option and the `"'nonce-{{nonce}}'"` placeholders are ignored when you build your app for SSG via `nuxi generate`._ @@ -304,28 +295,6 @@ Please see below our section on [Integrity Hashes For SSG](#integrity-hashes-for _Note: Hashes only work for SSG. The `ssg` options are ignored when you build your app for SSR via `nuxi build`._ - -## Hot reload during development - -If you have enabled `nonce-{{nonce}}` on `style-src`, you will need to disable it in order to allow hot reloading during development. - -```ts -export default defineNuxtConfig({ - security: { - nonce: true, - headers: { - contentSecurityPolicy: { - 'style-src': process.env.NODE_ENV === 'development' ? - ["'self'", "'unsafe-inline'"] : - ["'self'", "'unsafe-inline'", "nonce-{{nonce}}"] - } - } - } -}) -``` - -Note that this is not necessary if you use our default configuration settings. - ## Per-route configuration All Content Security Policy options can be defined on a per-route level. diff --git a/src/runtime/nitro/plugins/40-cspSsrNonce.ts b/src/runtime/nitro/plugins/40-cspSsrNonce.ts index ba97c305..e5b636e9 100644 --- a/src/runtime/nitro/plugins/40-cspSsrNonce.ts +++ b/src/runtime/nitro/plugins/40-cspSsrNonce.ts @@ -53,5 +53,12 @@ export default defineNitroPlugin((nitroApp) => { return element }) } + + // Add meta header for Vite in development + if (import.meta.dev) { + html.head.push( + ``, + ) + } }) })