CORS-Tester
Testen und diagnostizieren Sie Cross-Origin Resource Sharing (CORS)-Header für jede URL
Beispiel-URLs zum Testen
CORS verstehen
Was ist CORS?
Cross-Origin Resource Sharing (CORS) ist ein Sicherheitsmechanismus, der es einer Webseite eines Ursprungs ermöglicht, Ressourcen von einem anderen Ursprung anzufordern. Ohne CORS blockieren Browser solche Cross-Origin-Anfragen standardmäßig, um Sicherheitslücken zu verhindern.
So funktioniert CORS
Wenn ein Browser eine Cross-Origin-Anfrage stellt, sendet er einen Origin-Header. Der Server muss mit dem entsprechenden Access-Control-Allow-Origin-Header antworten. Bei nicht-einfachen Anfragen sendet der Browser zunächst eine OPTIONS-preflight-Anfrage, um zu prüfen, ob die eigentliche Anfrage erlaubt ist.
Wichtige CORS-Header
Access-Control-Allow-Origin gibt zulässige Ursprünge an. Access-Control-Allow-Methods listet erlaubte HTTP-Methoden auf. Access-Control-Allow-Headers definiert zulässige Anfrage-Header. Access-Control-Allow-Credentials gibt an, ob Cookies erlaubt sind.
CORS-Fehler debuggen
CORS-Fehler erscheinen in der Browser-Konsole, wenn eine Cross-Origin-Anfrage blockiert wird. Stellen Sie sicher, dass der Server die korrekten CORS-Header enthält. Bei APIs müssen Sie sicherstellen, dass der Server Ihren Origin, die erforderlichen Methoden und alle benutzerdefinierten Header zulässt, die Sie senden.
CORS-Tester
Testen und diagnostizieren Sie Cross-Origin Resource Sharing (CORS)-Header für jede URL
Funktionen
- Send real HTTP requests to a target URL and inspect CORS-related headers in the response
- Reports Access-Control-Allow-Origin, Allow-Methods, Allow-Headers, Allow-Credentials, Max-Age
- Tests preflight (OPTIONS) and actual-request behaviour
- Runs in your browser — your request is sent FROM your origin, so the result reflects what your real app would see
- Useful for debugging CORS-blocked production fetches
Anleitung
- Geben Sie die zu testende URL in das Eingabefeld ein oder wählen Sie eine der bereitgestellten Beispiel-URLs für schnelle Tests aus.
- Wählen Sie die HTTP-Methode (GET, POST usw.) und fügen Sie optional benutzerdefinierte Header im Bereich der erweiterten Optionen hinzu.
- Klicken Sie auf „CORS testen“, um eine Cross-Origin-Anfrage zu senden und die detaillierten Ergebnisse einschließlich aller CORS-Header und ihrer Werte anzuzeigen.
Tipps & Best Practices
- Each test sends a real HTTPS request to the target URL — the URL and your IP are visible to the target server.
- CORS is enforced by the browser, not the server. The server sends headers; the browser decides whether to expose the response to JS.
- For wildcard ACAO (`Access-Control-Allow-Origin: *`), the request will succeed but credentials (cookies) won't be sent — that's the spec.
- Preflight (OPTIONS) is sent only for non-simple requests (custom headers, non-GET/POST methods, JSON body in some cases).
- If the test fails, check the browser devtools Network tab — the actual error message is more detailed than this tool can surface.
FAQ
Was ist CORS und warum ist es für Webentwickler wichtig?
CORS (Cross-Origin Resource Sharing) ist eine Browser-Sicherheitsfunktion, die steuert, welche Webseiten Anfragen an eine andere Domain als die ausliefernde stellen dürfen. Es ist wichtig, weil moderne Webanwendungen häufig APIs auf verschiedenen Domains aufrufen müssen und ohne korrekte CORS-Konfiguration werden diese Anfragen vom Browser blockiert. Das Verständnis von CORS ist unerlässlich für die Entwicklung von Anwendungen, die mit Drittanbieter-APIs oder Microservices interagieren.
Warum erhalte ich einen CORS-Fehler, obwohl die API in Postman oder curl funktioniert?
CORS ist eine vom Browser durchgesetzte Sicherheitsrichtlinie und keine serverseitige Einschränkung. Tools wie Postman und curl umgehen CORS vollständig, da sie keine Browser sind und die Same-Origin-Policy nicht durchsetzen. Der Browser prüft speziell die CORS-Header in der Antwort des Servers und blockiert die Anfrage, wenn diese fehlen oder falsch sind. Deshalb kann eine API in Postman einwandfrei funktionieren, aber in einer Browseranwendung fehlschlagen.
Was ist eine preflight-Anfrage und wann sendet der Browser sie?
Eine preflight-Anfrage ist eine OPTIONS-Anfrage, die der Browser automatisch vor der eigentlichen Anfrage sendet, um zu prüfen, ob der Server die Cross-Origin-Anfrage erlaubt. Der Browser sendet einen preflight für Anfragen, die andere Methoden als GET, HEAD oder POST verwenden, oder die benutzerdefinierte Header enthalten, oder die Content-Type-Werte verwenden, die nicht application/x-www-form-urlencoded, multipart/form-data oder text/plain sind. Der Server muss mit geeigneten CORS-Headern antworten, damit die eigentliche Anfrage fortgesetzt werden kann.
Was bedeutet Access-Control-Allow-Origin: * und ist es sicher?
Der Wildcard-Wert * bedeutet, dass der Server Anfragen von jedem Ursprung erlaubt. Während dies für öffentliche APIs praktisch ist, kann es für private APIs, die sensible Daten verarbeiten, ein Sicherheitsrisiko darstellen. Bei Verwendung von * kann der Server Access-Control-Allow-Credentials nicht zusätzlich auf true setzen. Für APIs, die eine Authentifizierung erfordern, sollten Sie genaue erlaubte Ursprünge angeben, anstatt den Platzhalter zu verwenden.
Wie kann ich CORS-Fehler auf meinem Server beheben?
Um CORS-Fehler zu beheben, müssen Sie Ihren Server so konfigurieren, dass er die entsprechenden CORS-Header in seinen Antworten enthält. Fügen Sie mindestens Access-Control-Allow-Origin mit einem Platzhalter (*) oder dem konkreten anfragenden Ursprung hinzu. Bei nicht-einfachen Anfragen fügen Sie zusätzlich Access-Control-Allow-Methods und Access-Control-Allow-Headers hinzu. Die meisten Web-Frameworks haben CORS-Middleware-Pakete, die diese Konfiguration vereinfachen, wie cors für Express.js, django-cors-headers für Django oder rack-cors für Ruby on Rails.
Stellt dieses Tool tatsächlich echte Cross-Origin-Anfragen?
Ja, dieses Tool sendet echte fetch-Anfragen aus Ihrem Browser an die von Ihnen angegebene URL, was bedeutet, dass die CORS-Richtlinie des Browsers vollständig durchgesetzt wird. Wenn der Zielserver keine CORS-Header enthält, blockiert der Browser die Antwort und das Tool zeigt den Status „CORS blockiert“ an. Das gibt Ihnen ein genaues Bild davon, wie sich Ihre Browseranwendung beim Senden derselben Anfrage verhalten würde.