Astro -- Alle Security-Header-Anleitungen
Schritt-für-Schritt-Anleitungen für jeden Security Header in Astro. SSR-Middleware mit Nonces, Hybrid-Modus-Fallbacks und SSG-Hosting-Konfigurationen -- von HSTS in 5 Minuten bis CSP mit Islands.
Security Headers in Astro -- drei Output-Modi, drei Strategien
Astro unterstützt drei Output-Modi, die grundlegend beeinflussen, wie Sie Security Headers konfigurieren:
SSR (output: 'server') rendert jede Seite serverseitig und erlaubt dynamische
Header per src/middleware.ts. Hybrid (output: 'hybrid') kombiniert
statische und dynamische Seiten -- prerenderte Seiten verlieren Middleware-Header. SSG
(output: 'static') generiert rein statische HTML-Dateien ohne Server-Logik.
Im SSR- und Hybrid-Modus ist src/middleware.ts der zentrale Ort für alle Security Headers.
Die Middleware hat Zugriff auf context.locals, um Nonces zwischen Header und Template zu teilen --
ideal für eine Nonce-basierte Content Security Policy. Wolf-Agents selbst setzt dieses Muster produktiv ein.
Wichtig: Astro hat kein headers-Feld in astro.config.mjs.
Im SSG-Modus müssen Header vollständig auf dem Webserver (Nginx, Apache) oder der Hosting-Plattform
(Vercel, Netlify, Cloudflare Pages) konfiguriert werden. Unsere Anleitungen zeigen für jeden Header
alle Varianten.
Astro-Anleitungen nach Thema
Jede Anleitung erklaert einen Security Header Schritt für Schritt -- mit Astro-spezifischen Konfigurationen für SSR-Middleware, Hybrid-Modus-Fallbacks und SSG-Hosting-Varianten. Die Punkte zeigen den Einfluss auf Ihre Web Security Note.
Implementierungs-Architektur
Alle Security Headers zentral in src/middleware.ts verwalten -- SSR, Hybrid und SSG-Fallback mit Adapter-Konfiguration.
Content Security Policy (CSP)
Nonce-basierte CSP per Middleware mit Astro.locals.nonce -- inklusive Islands-Hydration und strict-dynamic.
HTTP Strict Transport Security
HTTPS erzwingen per Middleware oder Hosting-Konfiguration -- inklusive Preload und Adapter-spezifischen Varianten.
Sichere Cookie-Konfiguration
Astro.cookies API mit Secure, HttpOnly und SameSite -- Session-Cookies und Auth-Integration absichern.
Permissions Policy
Browser-APIs einschränken per Middleware -- Kamera, Mikrofon, Geolocation und Payment sperren.
Clickjacking-Schutz
X-Frame-Options und frame-ancestors per Middleware setzen -- Schutz vor Iframe-Einbettung und UI-Redressing.
Referrer-Policy
Referrer-Informationen kontrollieren per Middleware -- sensible URL-Parameter vor Drittanbietern schützen.
X-Content-Type-Options
MIME-Sniffing verhindern per Middleware -- nosniff-Header für SSR und SSG korrekt setzen.
Cross-Origin Headers
CORP, COEP und COOP gegen Spectre-Angriffe -- Middleware-Konfiguration mit Island-Kompatibilität.
Subresource Integrity
Hash-Prüfung externer Scripts über Astro-Integrationen und Build-Pipeline mit vite-plugin-sri.
security.txt
Kontaktdatei unter public/.well-known/ anlegen -- statisch in jedem Output-Modus verfügbar.
TLS & Zertifikate
TLS-Konfiguration auf Server-Ebene -- Let's Encrypt Automatisierung und Adapter-spezifische HTTPS-Setups.
Cache-Control
Sicherheitsrelevante Cache-Direktiven per Middleware -- private, no-store für authentifizierte Routen.
Reporting API
Report-To und Reporting-Endpoints per Middleware -- CSP-Violations und NEL-Reports sammeln.
Clear-Site-Data
Browser-Daten beim Logout löschen per API-Route -- cookies, storage und cache gezielt raeumen.
Erweiterte Header
Origin-Agent-Cluster, HTTPS-Redirects, X-DNS-Prefetch-Control und weitere Haertungsmassnahmen.
In 3 Schritten zur sicheren Astro-Konfiguration
Status prüfen
Starten Sie mit dem kostenlosen Web Security Check. 166 Prüfpunkte zeigen Ihnen in Sekunden, welche Header fehlen und wo Handlungsbedarf besteht.
Middleware anlegen
Erstellen Sie src/middleware.ts mit der
Implementierungs-Architektur.
Dort setzen Sie HSTS,
X-Content-Type-Options und Referrer-Policy in einer Datei -- sauberer als einzelne
Adapter-Konfigurationen.
CSP mit Nonces
Die Content Security Policy konfigurieren Sie
per Middleware mit crypto.randomUUID() als Nonce. Der Nonce wird ueber
Astro.locals.nonce in Templates verfügbar -- inklusive Islands-Kompatibilität
über 'strict-dynamic'.
Nicht Astro? Andere Anleitungen verfügbar
Webserver
CMS & Shop-Systeme
Frameworks & Sprachen
Hosting-Anbieter
Wie sicher ist Ihre Website?
Prüfen Sie es jetzt — kostenlos, ohne Registrierung, mit 166 Prüfpunkte.
Häufig gestellte Fragen
Wie setze ich Security Headers in Astro?
Im SSR-Modus (output: "server" oder "hybrid") setzen Sie alle Header zentral in src/middleware.ts über defineMiddleware. Im SSG-Modus (output: "static") kann Astro keine HTTP-Header setzen -- Sie konfigurieren diese auf dem Webserver (Nginx, Apache) oder der Hosting-Plattform (Vercel, Netlify).
Unterstützt Astro CSP-Nonces?
Ja, im SSR-Modus. In der Middleware generieren Sie einen Nonce per crypto.randomUUID(), speichern ihn in context.locals.nonce und setzen den CSP-Header. In .astro-Templates greifen Sie über Astro.locals.nonce darauf zu. Astro Islands (React, Vue, Svelte) benötigen strict-dynamic oder explizite Nonce-Attribute.
Was ist der Unterschied zwischen SSR, Hybrid und SSG für Security Headers?
SSR (output: "server") rendert jede Seite serverseitig -- die Middleware laeuft bei jedem Request. Hybrid (output: "hybrid") erlaubt prerender=true für einzelne Seiten -- prerenderte Seiten verlieren Middleware-Header. SSG (output: "static") generiert nur HTML-Dateien -- Header müssen auf Server- oder Hosting-Ebene gesetzt werden.
Funktioniert die Middleware auch für prerenderte Seiten?
Nein. Seiten mit export const prerender = true werden zur Build-Zeit gerendert und als statische HTML-Dateien ausgeliefert. Die Middleware laeuft nicht für diese Seiten. Setzen Sie Header für prerenderte Seiten über die Server-Konfiguration (z.B. Nginx add_header) oder Hosting-Plattform.
Welcher Astro-Adapter ist am besten für Security Headers?
Der @astrojs/node-Adapter bietet die groesste Kontrolle, da Sie die Middleware vollständig nutzen und zusätzlich Express-Middleware vorschalten koennen. Bei @astrojs/vercel und @astrojs/netlify konfigurieren Sie statische Header über vercel.json bzw. netlify.toml und nutzen die Astro-Middleware für dynamische Header wie CSP-Nonces.