HSTS für Nuxt 3 konfigurieren

Schritt-für-Schritt-Anleitung: HTTP Strict Transport Security in Nuxt 3 per nuxt-security oder routeRules einrichten und Preload beantragen.

Nuxt 3 · Schritt für Schritt

HSTS in Nuxt 3

HTTP Strict Transport Security (HSTS) weist Browser an, ausschließlich verschlüsselte HTTPS-Verbindungen zu verwenden. HSTS ist mit 15 von 166 Punkten ein wichtiger Faktor im Wolf-Agents Web Security Check. In Nuxt 3 setzen Sie den Header per nuxt-security Modul, routeRules oder Nitro Server Middleware.

Das nuxt-security Modul setzt HSTS automatisch mit sicheren Defaults. Ohne das Modul konfigurieren Sie HSTS über routeRules in nuxt.config.ts — eine einzige Zeile genügt für maximale Sicherheit.

1 Schritt 1 von 3

HSTS-Header konfigurieren

Wählen Sie eine der drei Methoden: Das nuxt-security Modul setzt HSTS mit sicheren Defaults automatisch. Alternativ nutzen Sie routeRules für eine deklarative Konfiguration oder eine Nitro Server Middleware für maximale Kontrolle.

nuxt.config.ts nuxt-security
// nuxt.config.ts — HSTS mit nuxt-security
export default defineNuxtConfig({
  modules: ['nuxt-security'],

  security: {
    headers: {
      strictTransportSecurity: {
        maxAge: 31536000,
        includeSubdomains: true,
        preload: true,
      },
    },
  },
})
nuxt.config.ts routeRules
// nuxt.config.ts — HSTS per routeRules
export default defineNuxtConfig({
  routeRules: {
    '/**': {
      headers: {
        'Strict-Transport-Security':
          'max-age=31536000; includeSubDomains; preload',
      },
    },
  },
})
server/middleware/hsts.ts Middleware
// server/middleware/hsts.ts — Nitro Middleware
export default defineEventHandler((event) => {
  setHeader(event,
    'Strict-Transport-Security',
    'max-age=31536000; includeSubDomains; preload'
  );
})
max-age=31536000

Der Wert 31536000 entspricht einem Jahr. Beginnen Sie in der Testphase mit einem niedrigeren Wert (z.B. 300 = 5 Minuten) und erhöhen Sie schrittweise, um Probleme frühzeitig zu erkennen.

2 Schritt 2 von 3

Header verifizieren

Erstellen Sie einen Production-Build und prüfen Sie den HSTS-Header. Der Dev-Server kann andere Header setzen als der Produktiv-Build — testen Sie deshalb immer mit nuxi build.

Terminal Verifizieren
# Production-Build
npx nuxi build
node .output/server/index.mjs

# HSTS-Header prüfen
curl -sI https://ihre-domain.de | grep -i strict

# Erwartete Ausgabe:
# Strict-Transport-Security: max-age=31536000; includeSubDomains; preload
3 Schritt 3 von 3

Preload beantragen

Wenn HSTS korrekt funktioniert, können Sie Ihre Domain bei der HSTS Preload List registrieren. Browser laden Ihre Domain dann ausschließlich über HTTPS — auch beim ersten Besuch, ohne vorherigen Header-Empfang.

Preload ist quasi-permanent. Die Entfernung dauert Monate. Stellen Sie sicher, dass alle Subdomains HTTPS unterstützen, bevor Sie bei hstspreload.org einreichen.

Häufige Fehler

SSG-Build hat kein HSTS

nuxt generate erzeugt statische Dateien ohne Server. HSTS muss dann auf dem Hosting-Anbieter (Vercel, Netlify, Nginx) konfiguriert werden.

nuxt-security überschreibt routeRules

Wenn nuxt-security aktiv ist, hat es Vorrang vor manuellen routeRules-HSTS-Headern. Konfigurieren Sie HSTS nur an einer Stelle.

Dev-Server hat andere Header

Der nuxi dev-Server setzt HSTS möglicherweise nicht korrekt. Testen Sie immer den Production-Build mit nuxi build.

Reverse Proxy doppelt HSTS

Wenn Nginx vor Nuxt als Reverse Proxy läuft und beide HSTS setzen, wird der Header doppelt gesendet. Konfigurieren Sie HSTS nur an einer Stelle.

Compliance-Relevanz

HSTS ist eine Grundvoraussetzung für sichere Websites. PCI DSS fordert die ausschließliche Nutzung starker Kryptografie — HSTS stellt sicher, dass keine unverschlüsselten Verbindungen möglich sind. NIS2 verlangt technische Maßnahmen zur Verschlüsselung von Daten in Transit. Der Wolf-Agents Web Security Check prüft HSTS inklusive Preload-Status und max-age-Wert.

Wie steht Ihre Domain bei HSTS?

Prüfen Sie es jetzt — kostenlos, ohne Registrierung, mit 166 Prüfpunkte.