Cross-Origin Headers für Express.js
COOP, CORP und optional COEP auf Express.js einrichten — mit Custom Middleware oder Helmet, differenziert per Route und mit fertigen Code-Beispielen.
Cross-Origin Headers auf Express.js
Express.js setzt Cross-Origin Headers über Middleware — entweder als Custom Middleware mit res.set() oder über Helmet, das crossOriginOpenerPolicy() und crossOriginResourcePolicy() als fertige Funktionen bereitstellt. Beide Wege erlauben differenzierte Steuerung per Route.
Diese Anleitung zeigt beide Ansätze: eine Custom Middleware für volle Kontrolle und Helmet als bewährte Alternative mit sicheren Defaults. Express-Middleware macht es einfach, verschiedene CORP-Werte für API-Routen und öffentliche Assets zu vergeben. Cross-Origin Headers bringen 30 von 166 Punkten im Wolf-Agents Web Security Check.
COOP und CORP per Middleware setzen
Die einfachste Methode: Eine Middleware setzt Cross-Origin-Opener-Policy und Cross-Origin-Resource-Policy für alle Routen. COEP bleibt bewusst auskommentiert — es kann externe Ressourcen blockieren.
app.use((req, res, next) => {
// Cross-Origin-Opener-Policy
res.set('Cross-Origin-Opener-Policy', 'same-origin');
// Cross-Origin-Resource-Policy
res.set('Cross-Origin-Resource-Policy', 'same-origin');
// Cross-Origin-Embedder-Policy (vorsichtig testen!)
// res.set('Cross-Origin-Embedder-Policy', 'require-corp');
next();
}); Registrieren Sie die Cross-Origin-Middleware vor Ihren Route-Handlern, aber nach CORS-Middleware. So werden die Header für alle Responses gesetzt, ohne CORS-Logik zu stören.
Binden Sie die Middleware an bestimmte Routen: app.use('/api/', apiCrossOrigin) für APIs und app.use('/assets/', assetsCrossOrigin) für öffentliche Assets.
Alternative: Helmet verwenden
Helmet ist die beliebteste Security-Middleware für Express. Sie bietet fertige Funktionen für Cross-Origin Headers mit bewährten Defaults — eine Zeile pro Header genügt.
const helmet = require('helmet');
app.use(helmet.crossOriginOpenerPolicy({ policy: 'same-origin' }));
app.use(helmet.crossOriginResourcePolicy({ policy: 'same-origin' }));
// app.use(helmet.crossOriginEmbedderPolicy()); // Vorsicht: kann externe Ressourcen blockieren Custom Middleware vs. Helmet
Custom Middleware
Keine Dependency. Volle Kontrolle. Ideal wenn Sie nur Cross-Origin Header brauchen und keine weiteren Helmet-Features nutzen.
Helmet
Bewährt, gut getestet. Setzt auch andere Security-Header (X-Frame-Options, X-Content-Type-Options). Eine Dependency, viele Vorteile.
Installation
npm install helmet installiert Helmet. Aktuell ~17 kB gzipped, keine transitiven Dependencies.
helmet.crossOriginEmbedderPolicy() explizit aufrufen — eine bewusste Entscheidung, um Produktionsprobleme zu vermeiden. COEP optional aktivieren und testen
Für vollständige Cross-Origin Isolation fügen Sie Cross-Origin-Embedder-Policy: require-corp hinzu. Prüfen Sie vorher, ob alle externen Ressourcen CORP- oder CORS-Header senden.
require-corp blockiert alle externen Ressourcen ohne CORP- oder CORS-Header — darunter Google Fonts, YouTube-Embeds, Analytics-Scripts und CDN-Bilder. Testen Sie gründlich in der Entwicklungsumgebung. # Express-Server starten
npm start
# Cross-Origin Header prüfen
curl -sI http://localhost:3000 | grep -i cross-origin
# Erwartete Ausgabe:
# cross-origin-opener-policy: same-origin
# cross-origin-resource-policy: same-origin credentialless Cross-Origin-Embedder-Policy: credentialless (Chrome 96+, Firefox 119+) ist weniger streng als require-corp und bricht seltener Drittanbieter-Ressourcen. Allerdings unterstützt Safari credentialless nicht.
Wie steht Ihre Domain bei Cross-Origin Headers?
Prüfen Sie es jetzt — kostenlos, ohne Registrierung, mit 166 Prüfpunkte.
Häufig gestellte Fragen
Helmet oder Custom Middleware — was ist besser?
Helmet ist bewährt, gut getestet und setzt sichere Defaults. Custom Middleware bietet volle Kontrolle und keine zusätzliche Dependency. Für die meisten Projekte ist Helmet empfehlenswert — es setzt neben Cross-Origin auch andere Security-Header wie X-Content-Type-Options und X-Frame-Options.
Kann ich CORP differenziert per Route setzen?
Ja. Express-Middleware kann an bestimmte Routen gebunden werden: app.use("/api/", apiMiddleware) für API-Routen und app.use("/assets/", assetsMiddleware) für öffentliche Assets. So erhalten APIs same-origin und öffentliche Assets cross-origin.
Setzt Helmet COEP automatisch?
Nein. Helmet setzt COEP nicht automatisch, weil es Drittanbieter-Ressourcen brechen kann. Sie müssen helmet.crossOriginEmbedderPolicy() explizit aufrufen. Helmet ist hier konservativ — bewusst, um Produktionsprobleme zu vermeiden.
Funktioniert die Middleware mit Express 5?
Ja. Die gezeigte Middleware funktioniert mit Express 4 und Express 5. res.set() ist in beiden Versionen stabil. Helmet unterstützt Express 5 ab Version 7.x.
Brauche ich Cross-Origin Headers, wenn ein Reverse Proxy davor steht?
Wenn Nginx oder Cloudflare die Header bereits setzt, brauchen Sie sie nicht zusätzlich in Express. Setzen Sie Header am besten an einer Stelle — entweder am Edge (Reverse Proxy) oder in der Anwendung (Express). Doppelte Header-Setzung kann zu Konflikten führen.
Brauche ich alle drei Cross-Origin Header in Express?
Nein. Starten Sie mit COOP (same-origin) und CORP (same-origin). Diese sind risikoarm und bieten Schutz vor Window-Manipulation und Ressourcen-Hotlinking. COEP nur hinzufügen, wenn Sie SharedArrayBuffer oder vollständige Cross-Origin Isolation benötigen.