Docs: Incorrect headers() usage in the Content Security Policy example repository

[diegocrivelaro]

What is the documentation issue?

Hello,

While following the "Content Security Policy" documentation, I cloned the linked example repository. However, when running yarn dev, I encountered an error due to the way headers() is called.

The current implementation in the example repository is:

const nonce = headers().get("x-nonce");  

However, this leads to an error because headers() is an async function. The correct approach should be:

const nonce = (await headers()).get("x-nonce");  

It would be great to have it updated to avoid confusion for other developers.

Is there any context that might help us understand?

The issue is specifically in the file: next.js/examples/with-strict-csp/app/page.js

Does the docs page already exist? Please link to it.

https://nextjs.org/docs/app/building-your-application/configuring/content-security-policy