Skip to content

Add environment-specific CSP headers for dev and prod #188

Description

@Akatenvictor

What

Configure different Content Security Policy headers for development and production environments to accommodate development tools while maintaining security in production.

Why

Development requires relaxed CSP (hot module replacement, dev tools, localhost connections) while production needs strict CSP. Using the same CSP in both environments either breaks dev or weakens prod security.

Scope

In scope:

  • Development CSP: allow localhost, eval (for HMR), inline scripts
  • Production CSP: strict source restrictions, no eval, no inline
  • Configuration through Next.js middleware or config
  • CSP report-only mode for initial deployment

Out of scope:

  • CSP violation reporting endpoint
  • Modifying application code for CSP
  • Subresource integrity (SRI) setup

Acceptance Criteria

  • Development CSP allows HMR and dev tools
  • Production CSP restricts all sources
  • No CSP violations in development mode
  • No CSP violations in production mode
  • CSP headers are present in HTTP responses

Technical Context

  • Next.js config at app/next.config.js
  • Middleware at app/src/middleware.ts

Activity

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Labels

    Stellar WaveIssues in the Stellar wave program

    Type

    No type

    Projects

    No projects

      Milestone

      No milestone

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions