AgentSkillsCN

astro-security

当在 Astro 6 中配置内容安全策略（CSP）、设置安全头、管理脚本/样式哈希、使用 nonce 或为适配器部署实施 experimentalStaticHeaders 时使用。

SKILL.md
--- frontmatter
name: astro-security
description: Use when configuring Content Security Policy (CSP) in Astro 6, setting security headers, managing script/style hashes, using nonces, or implementing experimentalStaticHeaders for adapter deployments.
versions:
  astro: "6"
user-invocable: true
references: references/csp-overview.md, references/csp-config.md, references/script-directive.md, references/style-directive.md, references/nonces.md, references/static-headers.md, references/templates/csp-basic.md, references/templates/csp-advanced.md
related-skills: astro-6, astro-deployment, solid-astro

Astro Security

Agent Workflow (MANDATORY)

Before ANY implementation, use TeamCreate to spawn 3 agents:

  1. •fuse-ai-pilot:explore-codebase - Analyze existing security config, adapters, headers
  2. •fuse-ai-pilot:research-expert - Verify latest Astro 6 CSP docs via Context7/Exa
  3. •mcp__context7__query-docs - Check CSP compatibility with deployment adapter

After implementation, run fuse-ai-pilot:sniper for validation.

Overview

When to Use

  • •Enabling CSP in an Astro 6 project (stable in v6.0.0)
  • •Configuring security.csp in astro.config.mjs
  • •Adding SHA-256/384/512 hashes for external scripts or styles
  • •Using nonces for dynamic script injection
  • •Setting up experimentalStaticHeaders for adapter-based CSP headers

CSP in Astro 6

Astro 6 ships Content Security Policy as a stable feature (previously experimental). When enabled:

  • •Astro automatically generates SHA hashes for all bundled scripts and styles
  • •Injects a <meta http-equiv="content-security-policy"> in each page's <head>
  • •Supports script-src and style-src directives by default

Limitations:

  • •Not supported in dev mode — test with build + preview
  • •External scripts and styles require manual hash configuration
  • •Incompatible with <ClientRouter /> view transitions (use native View Transition API)
  • •Shiki syntax highlighter (inline styles) not currently supported

Reference Guide

Concepts

TopicReferenceWhen to Consult
CSP overviewcsp-overview.mdUnderstanding CSP in Astro 6
Configurationcsp-config.mdAll config options
Script directivescript-directive.mdscript-src configuration
Style directivestyle-directive.mdstyle-src configuration
Noncesnonces.mdDynamic script injection
Static headersstatic-headers.mdAdapter-based CSP headers

Templates

TemplateWhen to Use
csp-basic.mdBasic CSP enable with algorithm
csp-advanced.mdFull config with directives + static headers

Best Practices

  1. •Always test with build + preview — CSP is inactive in dev mode
  2. •Start with SHA-512 — strongest hash algorithm
  3. •Use 'self' explicitly — not included by default in resources
  4. •Hash external scripts manually — compute SHA hashes for CDN resources
  5. •Combine with adapter headers — use experimentalStaticHeaders for Vercel/Netlify

Forbidden

  • •Testing CSP in dev mode (doesn't work — always use build + preview)
  • •Using <ClientRouter /> with CSP enabled
  • •Forgetting to add 'self' when using resources array
  • •Adding unsafe-inline (defeats purpose of CSP)