AddThisFeature

Content Security Policy

Cut script-injection risk with a policy the existing app can actually run under.

involved Security & Reliability

What it adds

A CSP built from an inventory of what the app really loads, rolled out in report-only mode before it is enforced.

What your agent is told to do

5
  1. 1

    Inventory first: every inline script and style, every third-party origin, every worker, frame, font, and image host the app loads. Report that list before writing a single directive.

  2. 2

    Add a per-response nonce to the inline scripts you must keep, and hashes for the ones you cannot make dynamic.

  3. 3

    Deploy in report-only mode, collect violations from real traffic for long enough to cover the slow paths, and only then enforce.

  4. 4

    Set a violation report endpoint that deduplicates by directive and blocked URI, so one broken third-party script does not produce a million rows.

  5. 5

    Do NOT reach for unsafe-inline or unsafe-eval to make the errors stop. A policy with unsafe-inline on script-src provides essentially none of the protection you added it for.

Edge cases it handles

6
  • Asset hosts, API origins, and analytics domains differ between development, staging, and production — generate the policy per environment.
  • Browser extensions inject scripts and will generate violation reports you cannot fix. Filter them out or they will drown the real signal.
  • Some third-party scripts load further scripts at runtime; the origin you allowlist is rarely the only one they need.
  • Violation reports can include URL fragments and query strings — strip anything sensitive before storing them.
  • The nonce must be unique per response and never cached; a cached page with a stale nonce blocks its own scripts.
  • Blocked content usually fails silently for the user. Watch error rates as well as reports when you flip to enforcing.

Definition of done

8
  • The policy is derived from an inventory of actual app dependencies.
  • Inline scripts use per-response nonces or hashes; unsafe-inline is not present on script-src.
  • A report-only rollout preceded enforcement, with violations reviewed.
  • A deduplicating report endpoint exists and filters extension noise.
  • Policies differ correctly by environment.
  • No sensitive data is retained in stored violation reports.
  • The feature matches the existing design system.
  • No existing functionality is broken.

Related features

How it works

  1. 1

    Copy the link

    Grab the Markdown instruction URL for this feature.

  2. 2

    Give it to your AI

    Paste it into Claude Code, Cursor, v0, Lovable — whatever you build with.

  3. 3

    It inspects, then implements

    Your agent reads your existing app first, then adds the feature to fit it.

Works with your stack

These instructions are written to adapt. They tell the agent to detect your framework, match your existing design system, and reuse what you already have — rather than assuming a particular stack.

Need it tighter than that? Customize the feature and tell it exactly what you're running.