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.

Express.js · Schritt für Schritt

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.

1 Schritt 1 von 3

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.js Custom Middleware
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();
});
Middleware-Reihenfolge beachten

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.

Differenziert per Route

Binden Sie die Middleware an bestimmte Routen: app.use('/api/', apiCrossOrigin) für APIs und app.use('/assets/', assetsCrossOrigin) für öffentliche Assets.

2 Schritt 2 von 3

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.

app.js Helmet
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 setzt COEP nicht automatisch. Sie müssen helmet.crossOriginEmbedderPolicy() explizit aufrufen — eine bewusste Entscheidung, um Produktionsprobleme zu vermeiden.
3 Schritt 3 von 3

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.

COEP mit 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.
Terminal Verifizieren
# 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
Alternative: 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.