Skip to content
MDView as Markdown

Netlify

Netlify is one of the few hosting platforms that solves the hard part of CSP for static sites: generating a unique nonce per request. Edge functions run per request, so a statically generated site can still carry a nonce-based policy - which normally means giving up static generation entirely.

What Netlify gives you

  • Headers set declaratively in your _headers file or netlify.toml, including Content-Security-Policy-Report-Only for a dry run.
  • A Content Security Policy extension, installed by a Team Owner and enabled per site under Project configuration > Build & Deploy > Content Security Policy.
  • Dynamic nonce generation using edge functions, either through the extension or the @netlify/plugin-csp-nonce build plugin if you prefer configuration as code.
  • Built-in violation reporting through the extension, viewable under Logs & Metrics > Functions - and Netlify's own documentation names Report URI as one of the third-party options if you would rather have proper aggregation, alerting and history.

Sending reports to Report URI

Add the header to your _headers file. Your URL comes from the Setup page:

/*
  Content-Security-Policy-Report-Only: default-src 'none'; form-action 'none'; frame-ancestors 'none'; report-uri https://abc123.report-uri.com/r/d/csp/reportOnly

That is the same starting policy we recommend for the CSP Wizard. Swap the header name to Content-Security-Policy and the endpoint to enforce once your reports are clean.

Things to watch for

  • The extension is installed at team level but enabled per site. Installing it is not the same as turning it on, and it is an easy step to miss.
  • If you use both the _headers file and the extension, be clear about which one is producing the header you are looking at - two policies means the browser enforces the intersection.
  • Nonce generation via edge functions runs on every request, so it interacts with your caching strategy. A page cached with its header will serve a stale nonce.

Official documentation

Netlify - Content Security Policy

Start Monitoring with Report URI

Already using us for CSP? Find your report-uri value on Setup, or view your CSP reports.

New to Report URI? Create an account and grab your report-uri value from the Setup page. Prefer a guided setup? The CSP Wizard builds a policy from your reports automatically once you're signed in.

Start your free trial