TLS für Next.js konfigurieren

Next.js auf Vercel erhält automatisch TLS 1.3. Für Self-Hosting empfehlen wir Nginx oder Caddy als Reverse Proxy — vollständige Kontrolle ohne Node.js TLS-Komplexität.

TLS prüfen Plattform entdecken

Next.js · Schritt für Schritt

Von Wolf-Agents Security Team · Aktualisiert: 26. März 2026

Next.js und TLS — Vercel automatisch, Self-Hosting über Proxy

Next.js auf Vercel erhält automatisch TLS 1.3 mit Let's Encrypt-Zertifikaten — ohne jede Konfiguration. Für Self-Hosting auf eigenem Server gibt es zwei Ansätze: einen Custom HTTPS-Server mit dem Node.js https-Modul oder — empfohlen — einen Reverse Proxy (Nginx, Caddy) vor Next.js.

TLS bringt 4 von 166 Punkten im Wolf-Agents Web Security Check. Der Reverse-Proxy-Ansatz ist die Best Practice für Produktionsumgebungen: Next.js läuft intern auf HTTP, der Proxy terminiert TLS und leitet Requests weiter. So profitieren Sie von bewährten TLS-Implementierungen, einfacher Zertifikatsverwaltung und besserer Performance.

Grundlagen: TLS 1.3 & Zertifikate

1 Schritt 1 von 4

Vercel — automatisches TLS 1.3

Auf Vercel gibt es nichts zu konfigurieren. Jede Vercel-Domain erhält automatisch ein TLS-Zertifikat von Let's Encrypt, HTTP-zu-HTTPS-Weiterleitung und TLS 1.3-Unterstützung. Benutzerdefinierte Domains werden im Dashboard hinzugefügt — das Zertifikat wird innerhalb von Sekunden ausgestellt.

# Vercel — kein Setup nötig
# TLS 1.3 + Let's Encrypt: automatisch
# HTTP → HTTPS Weiterleitung: automatisch
# Zertifikatserneuerung: automatisch

# Deployment
vercel deploy

# Custom Domain hinzufügen (Vercel Dashboard)
# → Settings → Domains → Add Domain
# → Vercel stellt automatisch TLS-Zertifikat aus

Vercel Edge Network

Vercel terminiert TLS am Edge — weltweit in über 100 Rechenzentren. Die Zertifikatserneuerung erfolgt automatisch, lange bevor das Zertifikat abläuft.

2 Schritt 2 von 4

Custom Server mit Node.js HTTPS

Für Self-Hosting ohne Reverse Proxy: Node.js https.createServer mit TLS-Optionen. Setzen Sie minVersion: 'TLSv1.2', um ältere Protokolle zu verhindern. Beachten Sie: Dieser Ansatz erfordert manuelle Zertifikatverwaltung und ist fehleranfälliger als ein Reverse Proxy.

// server.js — Custom HTTPS Server (Self-Hosting)
const https = require('https');
const fs = require('fs');
const next = require('next');

const dev = process.env.NODE_ENV !== 'production';
const app = next({ dev });
const handle = app.getRequestHandler();

const options = {
  key:  fs.readFileSync('/etc/letsencrypt/live/ihre-domain.de/privkey.pem'),
  cert: fs.readFileSync('/etc/letsencrypt/live/ihre-domain.de/fullchain.pem'),
  // Mindestversion TLS 1.2
  minVersion: 'TLSv1.2',
  // Sichere Cipher Suites
  ciphers: 'ECDHE-ECDSA-AES256-GCM-SHA384:ECDHE-RSA-AES256-GCM-SHA384:ECDHE-ECDSA-CHACHA20-POLY1305',
};

app.prepare().then(() => {
  https.createServer(options, (req, res) => {
    handle(req, res);
  }).listen(443, () => {
    console.log('HTTPS Server läuft auf Port 443');
  });
});

Custom Server deaktiviert einige Next.js-Optimierungen. Für neue Projekte empfehlen wir den Reverse-Proxy-Ansatz im nächsten Schritt.

3 Schritt 3 von 4

Reverse Proxy — empfohlene Produktions-Lösung

Die beste Produktions-Architektur für Self-Hosted Next.js: Nginx oder Caddy als Reverse Proxy terminiert TLS, Next.js läuft intern auf HTTP (Port 3000). Der X-Forwarded-Proto-Header teilt Next.js mit, dass die externe Verbindung HTTPS war. Für die Nginx TLS-Detailkonfiguration siehe die Nginx-Anleitung.

# Empfohlene Produktions-Architektur: Nginx als Reverse Proxy
# Next.js läuft auf HTTP intern (Port 3000)
# Nginx terminiert TLS und leitet weiter

# nginx.conf
server {
    listen 443 ssl http2;
    server_name ihre-domain.de;

    ssl_certificate     /etc/letsencrypt/live/ihre-domain.de/fullchain.pem;
    ssl_certificate_key /etc/letsencrypt/live/ihre-domain.de/privkey.pem;
    ssl_protocols       TLSv1.2 TLSv1.3;

    location / {
        proxy_pass http://localhost:3000;
        proxy_http_version 1.1;
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection 'upgrade';
        proxy_set_header Host $host;
        proxy_set_header X-Forwarded-Proto https;
    }
}

server {
    listen 80;
    server_name ihre-domain.de;
    return 301 https://$host$request_uri;
}

Caddy als Alternative

Caddy konfiguriert TLS vollautomatisch ohne weitere Einstellungen. Für eine schnelle Self-Hosted-Lösung: reverse_proxy localhost:3000 im Caddyfile — Caddy übernimmt Zertifikat und HTTPS.

4 Schritt 4 von 4

Konfiguration verifizieren

Die Verifikation ist unabhängig vom gewählten Ansatz gleich: TLS-Protokoll und Cipher Suite mit openssl s_client prüfen, HTTP-Weiterleitung testen und ein vollständiges Audit mit dem Wolf-Agents Web Security Check durchführen.

# TLS 1.3 prüfen
openssl s_client -connect ihre-domain.de:443 -tls1_3 2>&1 | grep -E "Protocol|Cipher"

# Zertifikat und Ablaufdatum prüfen
openssl s_client -connect ihre-domain.de:443 2>&1 | openssl x509 -noout -dates

# HTTP → HTTPS Weiterleitung prüfen
curl -sI http://ihre-domain.de | grep -E "HTTP|Location"

Wolf-Agents Web Security Check

Der Scanner prüft TLS-Version, Cipher Suites und Zertifikatskette — unabhängig davon, ob Next.js auf Vercel, hinter Nginx oder mit Custom Server läuft.

Auch verfügbar für:

Nginx Apache WordPress Cloudflare Express CaddyShopifyDemnächstTYPO3DemnächstHetznerDemnächstLaravelDemnächstDrupalDemnächstIONOSDemnächstAll-InklDemnächstShopwareDemnächstContaoDemnächstStratoDemnächstJoomlaDemnächstPHPDemnächstSpring BootDemnächst

Wie steht Ihre Domain bei TLS-Konfiguration?

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

Web Security Check starten Monitoring ab 199 EUR/Mo

Häufig gestellte Fragen

Brauche ich für Next.js auf Vercel TLS-Konfiguration?

Nein. Vercel konfiguriert TLS vollautomatisch: TLS 1.3, automatische Let's Encrypt-Zertifikate, HTTP-zu-HTTPS-Weiterleitungen und regelmäßige Zertifikatserneuerung. Sie müssen nichts konfigurieren — Vercel liefert standardmäßig eine A-Konfiguration bei Qualys SSL Labs.

Wie richte ich HTTPS für Next.js lokal in der Entwicklung ein?

Mit mkcert: mkcert -install && mkcert localhost. Dann in next.config.js experimental.https aktivieren (Next.js 13.5+) oder einen Custom Server mit https.createServer und den mkcert-Zertifikaten nutzen. Für lokales HTTPS ist das ausreichend — Produktions-TLS liegt beim Server oder Vercel.

Warum wird Reverse Proxy gegenüber Custom Server empfohlen?

Ein Reverse Proxy (Nginx, Caddy) bringt mehrere Vorteile gegenüber Node.js https.createServer: Bessere Performance bei statischen Assets, Zero-Downtime-Deployments, automatische Zertifikatserneuerung, HTTP/2 und HTTP/3 ohne Code-Änderungen, und bewährtere TLS-Implementierungen als Node.js.

Was ist experimental.https in Next.js?

Ab Next.js 13.5 gibt es in next.config.js die Option experimental: { https: true } für lokale Entwicklung — Next.js generiert automatisch lokale Zertifikate über mkcert. Diese Option ist ausschließlich für Entwicklung gedacht und nicht für Produktion geeignet.

Wie konfiguriere ich TLS-Optionen in einem Node.js Custom Server?

const options = { key: fs.readFileSync(keyPath), cert: fs.readFileSync(certPath), minVersion: "TLSv1.2", ciphers: "ECDHE-ECDSA-AES256-GCM-SHA384:..." }; https.createServer(options, app). Die minVersion-Option verhindert TLS 1.0/1.1. Für Produktion ist ein Reverse Proxy diese Komplexität wert.

Wie prüfe ich die TLS-Konfiguration meiner Next.js-App?

Der Wolf-Agents Web Security Check prüft die TLS-Konfiguration transparent — unabhängig davon, ob Next.js auf Vercel, hinter Nginx oder mit Custom Server läuft. Alternativ: openssl s_client -connect ihre-domain.de:443 -tls1_3 gibt Protocol: TLSv1.3 aus, wenn die Konfiguration korrekt ist.