Warum senden Browser bei CORS eine OPTIONS-Preflight-Anfrage?
Browser senden vor nicht-einfachen Anfragen (z. B. mit Authorization-Header oder Content-Type: application/json) einen OPTIONS-Preflight, um sicherzustellen, dass der Zielserver diese Methoden und Header autorisiert, bevor verändernde Daten übertragen werden.
Detailed Technical Explanation
Der Preflight-Mechanismus schützt Legacy-Server, die nie für Cross-Origin-Aufrufe ausgelegt waren. Erfüllt ein Request nicht die Kriterien einer "Simple Request", stoppt der Browser den Vorgang und sendet einen Vorab-Probeaufruf mit Access-Control-Request-* Headern.
Technical Example & Code
Der Browser validiert die Server-Freigabe, bevor der eigentliche Request abgesetzt wird.
// 1. Browser sends Preflight Request:
OPTIONS /api/orders HTTP/1.1
Host: api.example.com
Origin: https://app.curious-techie.com
Access-Control-Request-Method: POST
Access-Control-Request-Headers: content-type, authorization
// 2. Server approves the interaction:
HTTP/1.1 204 No Content
Access-Control-Allow-Origin: https://app.curious-techie.com
Access-Control-Allow-Methods: GET, POST, OPTIONS
Access-Control-Allow-Headers: Content-Type, Authorization
Access-Control-Max-Age: 86400
// 3. Browser now automatically sends the actual POST request!Why This Is the Case (Underlying Architectural Rationale)
"Verhindern, dass Web-Clients unautorisierte Statusänderungen auf fremden Webservern auslösen, die keine Cross-Origin-Absicherung implementiert haben."
Common Misconception vs Reality
"Preflight-Requests sichern APIs gegen Hacker und unbefugte Skripte ab."
CORS ist eine Sicherheitsgrenze im Webbrowser. HTTP-Clients wie cURL oder Backend-Services senden keinen Preflight und unterliegen nicht den CORS-Prüfungen.
Related Curious-Techie Resources
How to Fix CORS Preflight Errors: Step-by-Step Guide →
Diagnose and resolve preflight 403 Forbidden errors, missing headers, and proxy redirection bugs.
Interactive ToolCORS Checker & Header Generator →
Test preflight OPTIONS handling and generate production-ready Express and Nginx CORS rules.
Developer ReferenceCORS Headers Reference & Specifications →
Related Questions in the Q&A Knowledge Base
CORS allows standard GET requests without a preflight check for backward compatibility with the legacy web. Because HTML tags like `<form>`, `<img>`, and `<script>` have always been able to issue cross-origin GET requests without pre-approval, requiring preflights for all GETs would have broken decades of existing web architecture.
HTTP 401 Unauthorized means the user is not authenticated (identity unknown; credentials missing or invalid), whereas HTTP 403 Forbidden means the user is authenticated (identity known), but lacks the necessary permissions to access the requested resource.
Using 'unsafe-inline' in a Content Security Policy defeats XSS protection because it instructs the browser to execute any inline script found in the HTML. Since Cross-Site Scripting works by injecting malicious inline script tags or event handlers, 'unsafe-inline' allows the attacker's payload to run freely.
Zugehöriges technisches Ökosystem & nächste Schritte
Verwandte Fachartikel
What Is CORS (Cross-Origin Resource Sharing)?
The standard protocol enabling controlled cross-origin data access in modern browsers.
CSP vs CORS: Differences in Browser Defense Mechanisms
Distinguishing outbound resource loading restrictions from inbound server access control.
Troubleshooting: No Access-Control-Allow-Origin Header Present
Diagnose and fix the most common browser cross-origin blocking error with production configs.
Praxis-Diagnoselabore
Entwickler-Spezifikationen & Referenzen
Weiterlernen
CORS Policy & Preflight Handshake Lab
Simulate preflight OPTIONS probes and adjust Access-Control-Allow-* headers inside the browser sandbox.