Vercel — Alle Security-Header-Anleitungen
Schritt-für-Schritt-Anleitungen für jeden Security Header auf Vercel. vercel.json, Edge Middleware und Framework-Integration — von HSTS in 5 Minuten bis CSP mit Nonces.
Security Headers auf Vercel — drei Konfigurationswege
Vercel ist eine Hosting-Plattform für Frontend-Frameworks wie Next.js, Nuxt, SvelteKit und Astro.
Security Headers konfigurieren Sie auf drei Wegen: über die vercel.json fuer
statische Header, per Framework-Konfiguration (z.B. next.config.ts)
oder über Edge Middleware für dynamische Header wie CSP-Nonces.
Vercel erzwingt HTTPS automatisch für alle Deployments und stellt kostenlose Let's Encrypt Zertifikate bereit. Security Header wie HSTS, CSP oder Permissions-Policy müssen Sie jedoch manuell konfigurieren — Vercel setzt standardmäßig keine Security Header.
Wichtig: Vercel betreibt ein globales Edge Network mit Regionen in Europa (fra1 Frankfurt, cdg1 Paris) — relevant für DSGVO-Compliance. Edge Middleware läuft direkt auf diesem Netzwerk in V8 Isolates, nicht auf einem klassischen Node.js-Server.
Vercel-Anleitungen nach Thema
Jede Anleitung erklaert einen Security Header Schritt für Schritt — mit Vercel-spezifischen Konfigurationen für vercel.json, Edge Middleware und Framework-Integration. Die Punkte zeigen den Einfluss auf Ihre Web Security Note.
Implementierungs-Architektur
Alle Security Headers zentral über vercel.json, Edge Middleware und Framework-Config — konsolidierte Architektur für Vercel-Deployments.
Content Security Policy (CSP)
XSS-Schutz mit vercel.json für statische Policies oder Edge Middleware für dynamische Nonces pro Request.
HTTP Strict Transport Security
HTTPS erzwingen per vercel.json — Vercel erzwingt HTTPS automatisch, HSTS-Header für Preload manuell setzen.
Sichere Cookie-Konfiguration
Cookie-Attribute per Edge Middleware steuern — Secure, HttpOnly und SameSite für alle Set-Cookie-Header.
Permissions Policy
Browser-APIs einschränken per vercel.json oder Edge Middleware — Kamera, Mikrofon, Geolocation sperren.
Clickjacking-Schutz
X-Frame-Options und frame-ancestors per vercel.json — Preview Deployments beachten.
Referrer-Policy
Referrer-Informationen kontrollieren per vercel.json — gilt für alle Deployment-Umgebungen.
X-Content-Type-Options
MIME-Sniffing verhindern per vercel.json — einfacher One-Liner für alle Responses.
Cross-Origin Headers
CORP, COEP und COOP gegen Spectre-Angriffe — vercel.json mit Kompatibilität zu Third-Party-Embeds.
Subresource Integrity
Hash-Prüfung externer Scripts — Framework-seitig (Next.js, Nuxt) oder per Build-Pipeline generieren.
security.txt
Kontaktdatei unter public/.well-known/ — Vercel serviert statische Dateien aus dem public-Ordner.
TLS & Zertifikate
TLS-Konfiguration auf Vercel — automatische Let's Encrypt Zertifikate und TLS 1.2+ Standard.
Cache-Control
Sicherheitsrelevante Cache-Direktiven per vercel.json — Vercel Edge Network Caching beachten.
Reporting API
Report-To und Reporting-Endpoints per vercel.json oder Edge Middleware — CSP-Violations dauerhaft erfassen.
Clear-Site-Data
Browser-Daten beim Logout löschen über API Route oder Edge Middleware.
Erweiterte Header
Origin-Agent-Cluster, HTTPS-Redirects, Resource Isolation Policy und X-DNS-Prefetch-Control.
In 3 Schritten zur sicheren Vercel-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.
vercel.json anlegen
Erstellen Sie eine vercel.json mit allen Security Headers im Projekt-Root. Damit setzen Sie HSTS, X-Content-Type-Options und Referrer-Policy in einer Datei — der schnellste Weg fuer statische Header.
Edge Middleware für CSP-Nonces
Die Content Security Policy mit dynamischen
Nonces konfigurieren Sie über middleware.ts — Edge Middleware generiert pro
Request einen Nonce und setzt den CSP-Header dynamisch.
Nicht Vercel? 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
Wo konfiguriere ich Security Headers auf Vercel?
Es gibt drei Wege: Per vercel.json headers-Array für statische Header, über die Framework-Konfiguration (z.B. next.config.ts bei Next.js) oder per Edge Middleware (middleware.ts) für dynamische Header wie CSP-Nonces. Die vercel.json-Methode ist am einfachsten, Edge Middleware bietet maximale Kontrolle.
Was ist der Unterschied zwischen vercel.json und Edge Middleware?
vercel.json setzt statische Header für alle Requests, die dem Source-Pattern entsprechen. Edge Middleware läuft als Code auf Vercels Edge Network (V8 Isolates) und kann Header dynamisch pro Request generieren — ideal für CSP-Nonces. Bei Kollision gewinnt die Edge Middleware über vercel.json.
Gelten vercel.json-Header auch für API Routes?
Nein, vercel.json-Headers gelten standardmäßig nicht für API Routes (/api/*). Sie müssen API Routes separat behandeln — entweder per spezifischem Source-Pattern in vercel.json oder per Edge Middleware. Das ist ein häufiger Fehler bei Vercel-Deployments.
Wie verhält sich HSTS mit Vercel Preview Deployments?
Vercel Preview Deployments laufen auf eigenen Subdomains (z.B. projekt-abc123.vercel.app). HSTS mit includeSubDomains und Preload ist gefährlich, da es alle Subdomains betrifft. Setzen Sie HSTS mit Preload nur für Ihre Custom Domain, nicht für die vercel.app-Domain.
Kann ich CSP-Nonces auf Vercel verwenden?
Ja, über Edge Middleware. In middleware.ts generieren Sie pro Request einen Nonce mit crypto.randomUUID(), setzen ihn als CSP-Header und übergeben ihn per Request-Header an die Anwendung. Das Framework (z.B. Next.js) liest den Nonce und fügt ihn in Script-Tags ein.