Skill

Implement Robust Content Security Policies

Name: Implement Robust Content Security Policies
Availability: OnlineOnly
Author: VibeBaza

Expert agent for designing, implementing, and maintaining Content Security Policy (CSP) to protect web apps from client-side attacks.

Get skill

Works with githubexpress.jsdjangohelmet

VibeBaza

Maintainer?

Spark score

out of 100

Updated 6 months ago

Version 1.0.0

Models

claude

Add to Favorites

Why it matters

Secure your web applications by designing, implementing, and maintaining expert-level Content Security Policies (CSP). This asset helps protect against XSS and data injection attacks by defining trusted resource sources and progressively hardening your security posture.

Outcomes

What it gets done

Develop and refine CSP configurations using a phased approach, starting with report-only mode.

Implement nonce and hash-based CSP for secure inline script and style execution.

Configure CSP for multi-environment deployment (development vs. production).

Integrate CSP with popular frameworks like Express.js and Django, and set up violation reporting.

Install

Add it to your toolbox

Run in your project directory:

curl -fsSL https://spark.entire.vc/get/vb-content-security-policy | bash

Capabilities

What this skill does

Debug

Traces errors to their root cause and suggests fixes.

Review code

Analyzes code for bugs, style issues, and improvements.

Deploy / CI

Runs build pipelines, tests, and deploys to environments.

Write tests

Creates unit, integration, or end-to-end test cases.

Audit access

Reviews permissions and logs to flag unauthorized activity.

Overview

Content Security Policy Expert Agent

What it does

This agent specializes in designing, implementing, and maintaining Content Security Policy (CSP) configurations to protect web applications from XSS, data injection, and other client-side attacks while preserving functionality. It operates on CSP core principles, defining trusted sources for different resource types through directives. CSP follows a default-deny principle, blocking resources unless explicitly allowed. The agent details the fetch directive hierarchy, including default-src as a fallback and specific directives overriding it. It also explains the CSP evaluation order. The agent provides examples of a progressive CSP implementation strategy, starting with report-only mode and progressing to restrictive base policies. For instance, a crucial step involves eliminating unsafe keywords by using nonces for inline scripts and styles:

Content-Security-Policy: default-src 'self';
  script-src 'self' 'nonce-{random}';
  style-src 'self' 'nonce-{random}';
  img-src 'self' data: https:;
  font-src 'self';
  connect-src 'self';
  base-uri 'self';
  form-action 'self';
  frame-ancestors 'none'

The agent also covers nonce generation best practices, hash-based CSP for static content, advanced configurations like strict dynamic, multi-environment setups, and preventing common bypasses. It provides examples for setting up CSP reporting and monitoring, and includes framework-specific implementation examples for Express.js and Django. Finally, it aids in testing and debugging CSP using browser developer tools and external evaluators, while highlighting common mistakes to avoid.

Discussion