Was ist CORS und warum brauche ich es?

CORS (Cross-Origin Resource Sharing) erlaubt Browsern, Ressourcen von einem anderen Ursprung (Domain) als dem der aktuellen Seite anzufordern. Ohne CORS blockiert die Same-Origin-Policy solche Anfragen. CORS-Header teilen dem Browser mit, welche Cross-Origin-Anfragen erlaubt sind.

Was ist eine Preflight-Anfrage?

Für bestimmte Anfragen (nicht-einfache Methoden, benutzerdefinierte Header) sendet der Browser erst eine OPTIONS-Anfrage, um zu prüfen, ob die eigentliche Anfrage erlaubt ist. Der Server antwortet mit CORS-Headern. Cachen Sie Preflights mit Access-Control-Max-Age.

Warum funktioniert credentials: true nicht mit Origin: *?

Aus Sicherheitsgründen erlaubt der Browser keine Cookies/Authentifizierung mit dem Wildcard-Ursprung (*). Bei credentials: true müssen Sie den genauen Ursprung angeben: Access-Control-Allow-Origin: https://app.example.com. Dies verhindert credential-basierte Angriffe von beliebigen Seiten.

Wie konfiguriere ich CORS für mehrere Domains?

Access-Control-Allow-Origin erlaubt nur einen Wert (oder *). Für mehrere Domains: Prüfen Sie den Origin-Header der Anfrage gegen eine Whitelist und setzen Sie den passenden Origin dynamisch. Die meisten Frameworks (Express cors(), Spring @CrossOrigin) unterstützen dies nativ.

Was ist der Unterschied zwischen CORS und JSONP?

JSONP ist ein älterer Workaround über -Tags (nur GET). CORS ist der moderne Standard mit voller HTTP-Methoden-Unterstützung, Sicherheitskontrollen und Preflight-Mechanismus. Verwenden Sie immer CORS, JSONP gilt als veraltet und unsicher.

Wie verwende ich dieses Tool in Claude/Cursor?

Sie können dieses Tool über MCP verwenden. Fügen Sie den Toolypet MCP-Server mit 'npx -y @toolypet/mcp-server@latest' zu Ihrer KI-Agent-Konfiguration hinzu. Bitten Sie dann Ihre KI, mcp__toolypet__cors_header_generator mit Ihren Parametern zu verwenden.

Was ist MCP und warum unterstützt Toolypet es?

MCP (Model Context Protocol) ist ein offener Standard, der KI-Agenten wie Claude und Cursor die Nutzung externer Tools ermöglicht. Toolypet unterstützt MCP, damit Sie alle 65+ Tools sowohl im Browser als auch über KI-Agenten nutzen können, wodurch Berechnungen und Operationen nahtlos in Ihren KI-Workflow integriert werden.

CORS-Header-Generator | Toolypet

Kostenloser Online-CORS-Header-Generator. Cross-Origin-Resource-Sharing-Header konfigurieren. Als MCP verfugbar.

Was ist das?

Der CORS Header Generator erstellt Cross-Origin Resource Sharing-Headerkonfigurationen. Steuern Sie Cross-Origin-Anfragen für APIs.

Anleitung

Konfigurieren Sie erlaubte Ursprünge, Methoden und Header. CORS-Konfiguration wird generiert.

Vertiefung

Preflight-Anfragen und CORS-Fehlerbehandlung: Wann tritt ein Preflight auf? Der Browser sendet eine OPTIONS-Anfrage vor der eigentlichen Anfrage, wenn: nicht-einfache Methoden (PUT, DELETE, PATCH) verwendet werden, benutzerdefinierte Header gesendet werden (Authorization), oder Content-Type nicht text/plain, application/x-www-form-urlencoded oder multipart/form-data ist. Häufige CORS-Fehler: „No Access-Control-Allow-Origin header" — Server sendet keinen CORS-Header. „Origin not allowed" — Ursprung nicht in der Allowlist. „Method not allowed" — Methode nicht in Access-Control-Allow-Methods. „Header not allowed" — Header nicht in Access-Control-Allow-Headers. Debug-Tipps: Browser-DevTools Network-Tab zeigt Preflight-Anfragen. Prüfen Sie OPTIONS-Antwort-Header. Testen Sie mit curl: curl -X OPTIONS -H "Origin: http://example.com" -v. Nginx: Konfigurieren Sie OPTIONS-Handling explizit.

Beispiele

Generieren Sie CORS-Header für eine SPA mit Backend-API
Erstellen Sie CORS-Konfiguration mit Authentifizierungs-Unterstützung
Konfigurieren Sie CORS für mehrere erlaubte Ursprünge
Erstellen Sie restriktive CORS-Header mit spezifischen Methoden und Headern
Generieren Sie CORS-Konfiguration für Webserver (Nginx, Apache, Express.js)

Toolypet MCP-Server installieren

Fügen Sie Toolypet-Tools mit einem einzigen Befehl zu Ihrem KI-Agenten hinzu. Funktioniert mit Claude Desktop, Claude Code, Cursor und jedem MCP-kompatiblen Client.

Schnellstart

npx -y @toolypet/mcp-server@latest

MCP-Client-Konfiguration

{
  "mcpServers": {
    "toolypet": {
      "command": "npx",
      "args": [
        "-y",
        "@toolypet/mcp-server@latest"
      ]
    }
  }
}

Tool-Name:mcp__toolypet__cors_header_generator

Beispiel-Prompt

Generate CORS headers allowing requests from https://example.com with GET and POST methods

Eingabebeispiel

{
  "origins": [
    "https://example.com"
  ],
  "methods": [
    "GET",
    "POST"
  ],
  "headers": [
    "Content-Type",
    "Authorization"
  ],
  "credentials": true,
  "maxAge": 3600
}

Ausgabebeispiel

{
  "headers": {
    "Access-Control-Allow-Origin": "https://example.com",
    "Access-Control-Allow-Methods": "GET, POST",
    "Access-Control-Allow-Headers": "Content-Type, Authorization",
    "Access-Control-Allow-Credentials": "true",
    "Access-Control-Max-Age": "3600"
  }
}

Häufig gestellte Fragen

Was ist CORS und warum brauche ich es?: CORS (Cross-Origin Resource Sharing) erlaubt Browsern, Ressourcen von einem anderen Ursprung (Domain) als dem der aktuellen Seite anzufordern. Ohne CORS blockiert die Same-Origin-Policy solche Anfragen. CORS-Header teilen dem Browser mit, welche Cross-Origin-Anfragen erlaubt sind.
Was ist eine Preflight-Anfrage?: Für bestimmte Anfragen (nicht-einfache Methoden, benutzerdefinierte Header) sendet der Browser erst eine OPTIONS-Anfrage, um zu prüfen, ob die eigentliche Anfrage erlaubt ist. Der Server antwortet mit CORS-Headern. Cachen Sie Preflights mit Access-Control-Max-Age.
Warum funktioniert credentials: true nicht mit Origin: *?: Aus Sicherheitsgründen erlaubt der Browser keine Cookies/Authentifizierung mit dem Wildcard-Ursprung (*). Bei credentials: true müssen Sie den genauen Ursprung angeben: Access-Control-Allow-Origin: https://app.example.com. Dies verhindert credential-basierte Angriffe von beliebigen Seiten.
Wie konfiguriere ich CORS für mehrere Domains?: Access-Control-Allow-Origin erlaubt nur einen Wert (oder *). Für mehrere Domains: Prüfen Sie den Origin-Header der Anfrage gegen eine Whitelist und setzen Sie den passenden Origin dynamisch. Die meisten Frameworks (Express cors(), Spring @CrossOrigin) unterstützen dies nativ.
Was ist der Unterschied zwischen CORS und JSONP?: JSONP ist ein älterer Workaround über <script>-Tags (nur GET). CORS ist der moderne Standard mit voller HTTP-Methoden-Unterstützung, Sicherheitskontrollen und Preflight-Mechanismus. Verwenden Sie immer CORS, JSONP gilt als veraltet und unsicher.
Wie verwende ich dieses Tool in Claude/Cursor?: Sie können dieses Tool über MCP verwenden. Fügen Sie den Toolypet MCP-Server mit 'npx -y @toolypet/mcp-server@latest' zu Ihrer KI-Agent-Konfiguration hinzu. Bitten Sie dann Ihre KI, mcp__toolypet__cors_header_generator mit Ihren Parametern zu verwenden.
Was ist MCP und warum unterstützt Toolypet es?: MCP (Model Context Protocol) ist ein offener Standard, der KI-Agenten wie Claude und Cursor die Nutzung externer Tools ermöglicht. Toolypet unterstützt MCP, damit Sie alle 65+ Tools sowohl im Browser als auch über KI-Agenten nutzen können, wodurch Berechnungen und Operationen nahtlos in Ihren KI-Workflow integriert werden.