TLS & Zertifikate für Nuxt 3
Schritt-für-Schritt: TLS auf Hosting-Ebene konfigurieren, HSTS in Nuxt 3 aktivieren und Verschlüsselung verifizieren.
TLS & Zertifikate in Nuxt 3
TLS (Transport Layer Security) verschlüsselt die Verbindung zwischen Browser und Server und schützt Daten vor Abhören und Manipulation. Nuxt 3 selbst terminiert kein TLS — die Verschlüsselung erfolgt auf Hosting-Ebene durch einen Reverse Proxy wie Nginx oder eine Plattform wie Vercel. Mit 4 von 166 Punkten ist die TLS-Konfiguration ein Faktor im Wolf-Agents Web Security Check.
In der Praxis nutzen die meisten Nuxt-Deployments einen Reverse Proxy (Nginx, Caddy) oder eine Hosting-Plattform (Vercel, Netlify), die TLS-Terminierung übernimmt. Nuxt kann HSTS setzen, um HTTPS dauerhaft zu erzwingen, und muss den X-Forwarded-Proto-Header korrekt verarbeiten. Ein häufiger Irrtum: useHead() setzt nur HTML-Meta-Tags, keine HTTP-Header wie HSTS.
TLS auf Hosting-Ebene konfigurieren
Nuxt läuft als Node-Server ohne eigene TLS-Terminierung. Konfigurieren Sie TLS auf Ihrem Reverse Proxy oder Ihrer Hosting-Plattform. Let's Encrypt bietet kostenlose TLS-Zertifikate mit automatischer Verlängerung. Stellen Sie sicher, dass der X-Forwarded-Proto-Header gesetzt wird, damit Nuxt HTTPS-Verbindungen korrekt erkennt.
# /etc/nginx/sites-available/ihre-domain.de
# Nginx als TLS-Termination-Proxy vor Nuxt
server {
listen 443 ssl http2;
server_name ihre-domain.de;
# Let's Encrypt Zertifikat
ssl_certificate /etc/letsencrypt/live/ihre-domain.de/fullchain.pem;
ssl_certificate_key /etc/letsencrypt/live/ihre-domain.de/privkey.pem;
# Moderne TLS-Konfiguration (Mozilla Intermediate)
ssl_protocols TLSv1.2 TLSv1.3;
ssl_ciphers ECDHE-ECDSA-AES128-GCM-SHA256:ECDHE-RSA-AES128-GCM-SHA256:ECDHE-ECDSA-AES256-GCM-SHA384:ECDHE-RSA-AES256-GCM-SHA384;
ssl_prefer_server_ciphers off;
# OCSP Stapling für schnellere Verbindungen
ssl_stapling on;
ssl_stapling_verify on;
ssl_trusted_certificate /etc/letsencrypt/live/ihre-domain.de/chain.pem;
# Proxy zu Nuxt (Node-Server auf Port 3000)
location / {
proxy_pass http://127.0.0.1:3000;
proxy_set_header Host $host;
proxy_set_header X-Forwarded-Proto https;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header X-Real-IP $remote_addr;
}
}
# HTTP-zu-HTTPS-Redirect
server {
listen 80;
server_name ihre-domain.de;
return 301 https://$server_name$request_uri;
}# Let's Encrypt Zertifikat einrichten (Certbot + Nginx)
sudo apt install certbot python3-certbot-nginx
sudo certbot --nginx -d ihre-domain.de -d www.ihre-domain.de
# Automatische Verlängerung prüfen
sudo certbot renew --dry-run
# Cron-Job für automatische Verlängerung (bereits installiert)
# 0 0,12 * * * certbot renew --quietVercel und Netlify konfigurieren TLS automatisch mit kostenlosen Zertifikaten. Sie müssen nur HSTS in Nuxt setzen. Bei Vercel können Sie zusätzlich in vercel.json Header setzen, bei Netlify in netlify.toml.
HSTS in Nuxt aktivieren
Während TLS auf Hosting-Ebene konfiguriert wird, setzen Sie HSTS direkt in Nuxt. Der Header weist Browser an, ausschließlich HTTPS-Verbindungen zu verwenden. Zwei Wege: routeRules für einfache Konfiguration oder das nuxt-security Modul für die integrierte Verwaltung aller Security-Header.
// nuxt.config.ts — HSTS per routeRules
export default defineNuxtConfig({
routeRules: {
'/**': {
headers: {
'Strict-Transport-Security':
'max-age=31536000; includeSubDomains; preload',
},
},
},
})// nuxt.config.ts — HSTS mit nuxt-security
export default defineNuxtConfig({
modules: ['nuxt-security'],
security: {
headers: {
strictTransportSecurity: {
maxAge: 31536000,
includeSubdomains: true,
preload: true,
},
},
},
})Hinter einem Reverse Proxy muss X-Forwarded-Proto: https im Proxy gesetzt werden, damit Nuxt die HTTPS-Verbindung erkennt. Ohne diesen Header generiert Nuxt möglicherweise HTTP-URLs in Links und Redirects.
TLS-Konfiguration verifizieren
Erstellen Sie einen Production-Build und prüfen Sie TLS-Version, Cipher Suites und HSTS-Header. Der Dev-Server von Nuxt unterstützt kein TLS — testen Sie immer gegen den Produktiv-Build hinter dem Reverse Proxy. Der Wolf-Agents Web Security Check analysiert alle TLS-Details automatisch.
# TLS-Version und Cipher Suite prüfen
openssl s_client -connect ihre-domain.de:443 -brief 2>/dev/null | head -5
# Erwartete Ausgabe:
# CONNECTION ESTABLISHED
# Protocol version: TLSv1.3
# Ciphersuite: TLS_AES_256_GCM_SHA384
# HSTS-Header prüfen
curl -sI https://ihre-domain.de | grep -i strict
# Erwartete Ausgabe:
# Strict-Transport-Security: max-age=31536000; includeSubDomains; preload
# Zertifikat-Details anzeigen
echo | openssl s_client -connect ihre-domain.de:443 2>/dev/null | \
openssl x509 -noout -dates -subject
# Cache leeren nach Änderungen
npx nuxi cleanup && npx nuxi devHäufige Fehler
Nuxt kann TLS nicht direkt konfigurieren
Nuxt läuft als Node.js-Anwendung ohne TLS-Terminierung. Versuchen Sie nicht, TLS in nuxt.config.ts zu konfigurieren. Verwenden Sie einen Reverse Proxy (Nginx, Caddy) oder eine Hosting-Plattform (Vercel, Netlify) für TLS.
X-Forwarded-Proto fehlt im Reverse Proxy
Ohne proxy_set_header X-Forwarded-Proto https in Nginx erkennt Nuxt hinter dem Proxy nicht, dass HTTPS aktiv ist. Links, Redirects und Canonical-URLs können fälschlicherweise HTTP verwenden.
Mixed Content bei SSG-Builds
Bei nuxt generate (SSG) können absolute HTTP-URLs in generierten Seiten Mixed-Content-Warnungen auslösen. Verwenden Sie HTTPS-URLs oder protokoll-relative URLs (//cdn.example.com) in allen Ressourcen-Referenzen.
HSTS auf dem Reverse Proxy UND in Nuxt
Wenn Nginx und Nuxt beide HSTS setzen, wird der Header doppelt gesendet. Konfigurieren Sie HSTS nur an einer Stelle — entweder im Reverse Proxy oder in Nuxt, nicht in beiden.
Compliance-Relevanz
TLS ist die grundlegendste Sicherheitsmaßnahme für Webanwendungen. PCI DSS 4.0 (Anforderung 4.2.1) fordert TLS 1.2 oder höher für alle Verbindungen, die Kartendaten übertragen. DSGVO (Artikel 32) verlangt angemessene Verschlüsselung personenbezogener Daten während der Übertragung. NIS2 (Artikel 21) fordert Maßnahmen zur Sicherung der Kommunikation, einschließlich Verschlüsselung. BSI IT-Grundschutz (CON.3) empfiehlt die ausschließliche Nutzung starker TLS-Versionen und Cipher Suites. Der Wolf-Agents Web Security Check prüft TLS-Version, Cipher Suites und Zertifikat-Details mit bis zu 4 Punkten.
Wie steht Ihre Domain bei TLS & Zertifikate?
Prüfen Sie es jetzt — kostenlos, ohne Registrierung, mit 166 Prüfpunkte.