5eea161d8b
There's been some confusion on the correct way to add a `nonce`, so took the opportunity here to: - Add a new docs page for Content Security Policy - Explained how to generate a `nonce` with Middleware - Showed how to consume the `nonce` in a route with `headers` - Updated the `with-strict-csp` example - Update the `nonce` error message page - Backlinked to the new page in a few places in the docs
25 lines
1.1 KiB
Markdown
25 lines
1.1 KiB
Markdown
# Content Security Policy with Nonce
|
|
|
|
This example shows how to create a Next.js application that sets a strict Content Security Policy (CSP) for your pages, including generating a dynamic nonce.
|
|
|
|
## Deploy your own
|
|
|
|
[![Deploy with Vercel](https://vercel.com/button)](https://vercel.com/new/clone?repository-url=https://github.com/vercel/next.js/tree/canary/examples/with-strict-csp&project-name=with-strict-csp&repository-name=with-strict-csp)
|
|
|
|
## How to use
|
|
|
|
Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init), [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/), or [pnpm](https://pnpm.io) to bootstrap the example:
|
|
|
|
```bash
|
|
npx create-next-app --example with-strict-csp with-strict-csp-app
|
|
```
|
|
|
|
```bash
|
|
yarn create next-app --example with-strict-csp with-strict-csp-app
|
|
```
|
|
|
|
```bash
|
|
pnpm create next-app --example with-strict-csp with-strict-csp-app
|
|
```
|
|
|
|
Deploy it to the cloud with [Vercel](https://vercel.com/new?utm_source=github&utm_medium=readme&utm_campaign=next-example) ([Documentation](https://nextjs.org/docs/deployment)).
|