Skip to content
Back to skills

Content Security Policy

ASecurity

Use when reviewing headers, forms, cookies, or third-party integrations related to Implement a content security policy. Validate the effective browser and HTTP behavior in a production-like environment.

  • 74,358 stars
  • 0 votes
  • 0 copies
  • 0 views
  • Added October 5, 2026
developmentrustgofrontendsecurity

Works with

  • cli

Security analysis

A100/100

Pro scans all 2 files and shows the line behind each finding

Scanned October 5, 2026

npx -y skills add thedaviddias/Front-End-Checklist --skill content-security-policy --agent claude-code

Installs into .claude/skills of the current project.

Are you the author of Content Security Policy?

Add the live security badge to your README. It updates with every re-scan.

Security grade badge for Content Security Policy
[![Security: A — Skills Directory](https://www.skillsdirectory.com/api/skills/thedaviddias-content-security-policy/badge)](https://www.skillsdirectory.com/skills/thedaviddias-content-security-policy)

More formats (shields.io, HTML) on the badges page. Keep it an A: scan every change in CI with Pro.

Download with Pro
SKILL.md
---
name: content-security-policy
description: "Use when reviewing headers, forms, cookies, or third-party integrations related to Implement a content security policy. Validate the effective browser and HTTP behavior in a production-like environment."
metadata:
  category: security
  priority: high
  difficulty: advanced
  estimatedTime: "45"
  source: frontendchecklist.io
  url: https://frontendchecklist.io/rules/security/content-security-policy
---

# Implement a content security policy

Content Security Policy prevents cross-site scripting (XSS), clickjacking, and data injection attacks by controlling which resources can be loaded and executed on your pages. It reduces blast radius, but it does not replace output encoding and sanitization.

## Quick Reference

- Start with Content-Security-Policy-Report-Only to test without breaking your site
- Use nonces or hashes for inline scripts instead of unsafe-inline
- Avoid unsafe-eval unless absolutely necessary
- Set strict default-src then allow specific sources
- Monitor CSP reports to catch violations
- Sanitize untrusted HTML before rendering it into the DOM
- Use Trusted Types in larger apps as defense in depth for DOM XSS sinks

## Check

Check if this website implements a Content Security Policy header and analyze its directives. Also review any use of `innerHTML`, `dangerouslySetInnerHTML`, HTML template injection, and Trusted Types enforcement for large applications.

## Fix

Implement a strict Content Security Policy to prevent XSS attacks and control resource loading. Sanitize untrusted HTML before rendering and add Trusted Types enforcement where the application has enough DOM injection surface to benefit from it.

## Explain

Explain how CSP provides a security layer that helps detect and mitigate XSS and data injection attacks, and why sanitization is still required before rendering untrusted HTML.

## Code Review

Review server config, headers, forms, and integration points related to Implement a content security policy. Flag exact responses, cookies, or browser behaviors that violate the rule, and verify them against the effective production-like response. Inspect HTML injection sinks and note whether Trusted Types or sanitization protects them.

---

For full implementation details, code examples, and framework-specific guidance,
see `references/rule.md`.

Rule page: https://frontendchecklist.io/rules/security/content-security-policy

Files in this skill

  • SKILL.md2.4 KB
  • references/rule.md10.7 KB

Attribution

Is this your skill, or is something wrong with this listing? Request removal or report an issue. Author removals are honored within 72 hours.

Comments

Loading comments…