Erweiterte Header für Nuxt 3 konfigurieren
Origin-Agent-Cluster, X-DNS-Prefetch-Control und Cross-Origin-Isolation in Nuxt 3 einrichten — per nuxt-security, routeRules oder Nitro Middleware.
Erweiterte Header in Nuxt 3
Erweiterte Header umfassen zusätzliche Defense-in-Depth-Maßnahmen jenseits der Kern-Header wie CSP und HSTS. Dazu gehören Origin-Agent-Cluster für Prozess-Isolation, X-DNS-Prefetch-Control für Privacy, X-Permitted-Cross-Domain-Policies gegen Flash/PDF-Angriffe und die Cross-Origin-Isolation-Header. Mit 4 von 166 Punkten im Wolf-Agents Web Security Check bewertet.
In Nuxt 3 gibt es drei Wege zur Konfiguration: Das nuxt-security Modul setzt die meisten dieser Header automatisch. Alternativ konfigurieren routeRules statische Header ohne zusätzliches Modul. Für maximale Kontrolle — z.B. unterschiedliche Header für API- und Frontend-Routen — nutzen Sie eine Nitro Server Middleware.
Erweiterte Header in Nuxt 3 konfigurieren
Der empfohlene Weg ist das nuxt-security Modul, das Origin-Agent-Cluster und X-DNS-Prefetch-Control automatisch setzt. Installation: npx nuxi module add nuxt-security. Für Projekte ohne nuxt-security nutzen Sie routeRules oder eine Nitro Middleware.
// nuxt.config.ts — Erweiterte Header mit nuxt-security
export default defineNuxtConfig({
modules: ['nuxt-security'],
security: {
headers: {
// Origin-Agent-Cluster: Prozess-Isolation
'Origin-Agent-Cluster': '?1',
// DNS-Prefetch deaktivieren (Privacy)
'X-DNS-Prefetch-Control': 'off',
// Cross-Domain-Policies blockieren
'X-Permitted-Cross-Domain-Policies': 'none',
// Cross-Origin Isolation (optional, strikt)
'Cross-Origin-Opener-Policy': 'same-origin',
'Cross-Origin-Embedder-Policy': 'require-corp',
'Cross-Origin-Resource-Policy': 'same-origin',
},
},
}) // nuxt.config.ts — routeRules ohne nuxt-security
export default defineNuxtConfig({
routeRules: {
'/**': {
headers: {
'Origin-Agent-Cluster': '?1',
'X-DNS-Prefetch-Control': 'off',
'X-Permitted-Cross-Domain-Policies': 'none',
},
},
// API-Routen: zusätzliche Isolation
'/api/**': {
headers: {
'Origin-Agent-Cluster': '?1',
'X-DNS-Prefetch-Control': 'off',
'X-Permitted-Cross-Domain-Policies': 'none',
'Cross-Origin-Resource-Policy': 'same-origin',
},
},
},
}) // server/middleware/advanced-headers.ts
// Nitro Middleware für maximale Kontrolle
export default defineEventHandler((event) => {
const headers = {
'Origin-Agent-Cluster': '?1',
'X-DNS-Prefetch-Control': 'off',
'X-Permitted-Cross-Domain-Policies': 'none',
'Cross-Origin-Opener-Policy': 'same-origin',
'Cross-Origin-Resource-Policy': 'same-origin',
};
for (const [key, value] of Object.entries(headers)) {
setHeader(event, key, value);
}
}) Origin-Agent-Cluster: ?1? Der Header fordert den Browser auf, die Seite in einem eigenen Prozess (Agent Cluster) zu isolieren. Das verhindert Spectre-ähnliche Seitenkanalangriffe zwischen same-site Origins. Aktuell nur in Chromium-Browsern unterstützt — schadet aber nicht in anderen Browsern.
Header verifizieren
Erstellen Sie einen Production-Build und prüfen Sie die erweiterten Header. Der Wolf-Agents Web Security Check analysiert alle Header-Kategorien und liefert eine Gesamtnote von A+ bis F.
# Production-Build und Header prüfen
npx nuxi build
node .output/server/index.mjs
# Erweiterte Header prüfen
curl -sI https://ihre-domain.de | grep -iE "origin-agent|x-dns|x-permitted|cross-origin"
# Erwartete Ausgabe:
# origin-agent-cluster: ?1
# x-dns-prefetch-control: off
# x-permitted-cross-domain-policies: none
# cross-origin-opener-policy: same-origin
# API-Route separat prüfen
curl -sI https://ihre-domain.de/api/health | grep -i cross-origin-resource
# cross-origin-resource-policy: same-origin Häufige Fehler
COEP bricht externe Ressourcen
Cross-Origin-Embedder-Policy: require-corp blockiert alle externen Ressourcen, die kein CORS oder Cross-Origin-Resource-Policy setzen. Google Fonts, Analytics und CDN-Assets werden blockiert. Nutzen Sie credentialless als Alternative.
nuxt-security überschreibt routeRules
Wenn nuxt-security aktiv ist, überschreibt es Header aus routeRules. Konfigurieren Sie Header entweder über nuxt-security oder routeRules — nicht beides gleichzeitig für denselben Header.
SSG-Build verliert Server-Header
nuxt generate erzeugt statische HTML-Dateien. Server-Header müssen auf dem Hosting-Anbieter konfiguriert werden — in vercel.json, Netlify _headers oder der CDN-Konfiguration.
COOP blockiert OAuth-Popups
Cross-Origin-Opener-Policy: same-origin verhindert window.opener-Zugriff von OAuth-Popups. Verwenden Sie same-origin-allow-popups wenn Ihre Anwendung OAuth-Login per Popup nutzt.
Compliance-Relevanz
Erweiterte Header sind Defense-in-Depth-Maßnahmen, die zusammen mit den Kern-Headern eine umfassende Sicherheitsarchitektur bilden. Origin-Agent-Cluster schützt gegen Spectre-ähnliche Seitenkanalangriffe. X-DNS-Prefetch-Control verhindert ungewollte DNS-Anfragen und schützt die Privacy der Nutzer. Cross-Origin-Isolation (COOP + COEP) ermöglicht den Zugriff auf leistungsstarke APIs wie SharedArrayBuffer bei gleichzeitiger Isolation. Der Wolf-Agents Web Security Check bewertet alle Header-Kategorien und liefert eine Gesamtnote von A+ bis F.
Wie steht Ihre Domain bei Erweiterte Header?
Prüfen Sie es jetzt — kostenlos, ohne Registrierung, mit 166 Prüfpunkte.