cloudflare / cloudflare/vinext

App Router: add CSP nonces to segment-owned script tags

Open
#3,205 0 comments 0 reactions 0 assignees View on GitHub
nextjs-tracking
Dominant language
TypeScript
Stars
8.8k
Forks
406
Avg merge
2d 6h
Merged PRs (30d)
120

Description

App Router scripts emitted for `loading`, `error`, and `template` segment files must receive the request CSP nonce. Without it, a nonce-based `script-src` policy blocks client chunks owned only by those segment files.

Upstream: https://github.com/vercel/next.js/commit/8b037a6748d6b09b040efd3354a15bc58fcf6830

Ensure segment-owned scripts receive the same request nonce as layout and page assets. Add coverage using a `strict-dynamic` nonce CSP where loading/template client chunks are not otherwise included by the page, and verify browser hydration runs without CSP violations.

Contributor guide

Open the contributing guide

Research direction

Start by tracing how App Router scripts for `loading`, `error`, and `template` segment files are emitted and how layout/page assets receive the request CSP nonce. Add coverage with a `strict-dynamic` nonce CSP where loading/template client chunks are absent from the page's other assets. Done means those scripts carry the nonce and browser hydration runs without CSP violations.

Written by the indexing model from the issue text.

Assessment

Tech stack
next.js, typescript, vite
Domain
frontend, security, testing
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Active
Clarity
Clearly specified
Newbie friendliness
68/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.