Why does the output differ so much between frameworks for the same policy?

Each server/framework has its own native syntax for setting a response header: Nginx uses add_header directives in a server block, Apache uses mod_headers' Header directive, Express sets headers imperatively in middleware, and Next.js declares them declaratively in next.config.js. The policy string itself is identical across all four, only the surrounding syntax changes.

What does enabling the nonce placeholder actually do?

It appends a `'nonce-__NONCE__'` source to script-src and style-src, and adds a comment reminding you to replace `__NONCE__` with a real, freshly generated random value on every request. A nonce lets you allow specific inline scripts/styles (by adding the same nonce as an attribute) without allowing all inline code, but the actual random value has to be generated server-side per request, which this static generator can't do for you.

Can I combine this with the Cloudflare CSP Generator?

Yes, they build the same kind of policy string but this one focuses on general server/framework config syntax (Nginx/Apache/Express/Next.js) while the Cloudflare version focuses on Cloudflare Pages' _headers file and includes toggles for Cloudflare Web Analytics and Google Fonts sources specifically.

Does this validate that my directive sources are syntactically correct?

It checks that each row has both a directive name and a non-empty source list, but it doesn't validate the source syntax itself (a typo'd 'self' without quotes, for example, would still be accepted), so double-check each source value before deploying.

CSP Header Generator - Nginx, Apache, Express, Next.js

Overview

Introduction

A Content-Security-Policy is one header value, but every server and framework has its own way of actually setting it, and it's easy to get the surrounding syntax wrong even when the policy itself is correct.

This tool builds the policy from directive rows and outputs it wrapped in the exact syntax your framework expects, whether that's an Nginx add_header line, an Apache Header directive, an Express middleware, or a Next.js config function.

What Is CSP Header Generator?

A CSP builder with a framework toggle (Nginx, Apache, Express, Next.js) and repeatable directive rows, each pairing a directive name (like script-src) with its space-separated source list.

It includes a nonce placeholder toggle that appends a `'nonce-__NONCE__'` source to script-src and style-src, with a reminder comment that the real value must be generated per-request on your server.

How CSP Header Generator Works

Your directive rows are joined into a single semicolon-separated policy string, exactly as the Content-Security-Policy header expects.

That string is then wrapped in the syntax specific to your chosen framework: an `add_header` line for Nginx, a `Header always set` line for Apache, a small Express middleware function, or a Next.js `headers()` config block.

When To Use CSP Header Generator

Use it when adding a CSP to a server you control directly (as opposed to a platform like Cloudflare Pages, which has its own dedicated CSP generator in this app) and you want the config syntax right on the first try.

It's also useful when migrating a CSP from one server/framework to another, rebuild the same directive rows and get output in the new syntax.

Often used alongside HTTP Security Headers Generator, CORS Configuration Generator and SSL/TLS Config Generator.

Features

Advantages

Covers four common server/framework targets with their real, correct configuration syntax.
The nonce toggle handles the easy-to-forget detail that nonces must be per-request and dynamically generated, via an explicit reminder comment rather than a fake static value.
Directive rows are fully custom, not limited to a fixed preset list, so any CSP directive can be added.

Limitations

Doesn't generate or manage the actual per-request nonce value, that has to be wired into your server's request-handling code separately.
Doesn't validate CSP source syntax semantically, only that each row has both a directive and sources filled in.

Examples

A minimal self-only policy for Express

Input

framework: Express, rows: default-src 'self'; script-src 'self'

Output

app.use((req, res, next) => {
  res.setHeader("Content-Security-Policy", "default-src 'self'; script-src 'self'");
  next();
});

The two directive rows are joined with a semicolon into the policy string, then wrapped in an Express middleware function that sets the header on every response.

Best Practices & Notes

Best Practices

Test any new or changed CSP as Content-Security-Policy-Report-Only first if your server also supports setting that header, to catch breakage before enforcing.
Keep directive lists as narrow as possible, add a source only once you've confirmed something legitimate is actually being blocked without it.
If using nonces, make sure your templating/rendering layer actually injects the same per-request nonce value into both the header and the relevant inline `<script>`/`<style>` tags.

Developer Notes

The policy string is built once (directive + sources, optionally with a nonce placeholder source on script-src/style-src) and then wrapped per-framework: Nginx and Apache both need the value double-quoted inline in a single directive line, while Express and Next.js embed it as a JavaScript string literal inside their respective config shapes.

CSP Header Generator Use Cases

Adding a Content-Security-Policy to a self-hosted Nginx or Apache server
Setting a CSP in an Express or Next.js application's own config/middleware
Migrating an existing CSP from one server/framework to another with the same directive rows

Common Mistakes

Hardcoding a single static string as the nonce value instead of generating a fresh random one per request, which defeats the purpose of using a nonce at all.
Forgetting that Nginx and Apache require `always` on the header directive to ensure the header is sent on error responses too, not just successful ones.

Tips

Use the Cloudflare CSP Generator instead if you're deploying to Cloudflare Pages specifically, it outputs directly to the _headers file format and includes Cloudflare-specific source toggles.

CSP Header Generator