CORS-tester

Volgende: origin en headers

Controleer hoe een endpoint antwoordt op een CORS-preflight. Voer de openbare URL in, de origin van je webapp, de methode van het beoogde verzoek en de headernamen die toestemming nodig hebben. Deze tester verstuurt een OPTIONS-verzoek vanaf onze server en legt uit welke controles slagen of mislukken. Hij verstuurt niet je beoogde API-verzoek en bootst geen browsersessie na.

Zo controleer je een CORS-preflight

  1. 1

    Voer het endpoint in

    Gebruik de openbare HTTP- of HTTPS-URL die je app aanroept, inclusief het pad en eventuele relevante queryparameters. Neem geen geheimen op: de URL wordt naar onze server en het doel gestuurd en verschijnt in het adres van de stappenpagina’s.

  2. 2

    Beschrijf het verzoek

    Kies GET, HEAD, POST, PUT, PATCH of DELETE. Voer de origin van je app in als schema, hostnaam en eventueel poort, bijvoorbeeld https://example.com. Een origin bevat geen pad.

  3. 3

    Stel headers en credentials in

    Voer headernamen in, gescheiden door komma’s, bijvoorbeeld content-type, authorization. Plak geen waarden of tokens. Schakel de credentialscontrole in als het beoogde verzoek credentialsmodus include gebruikt.

  4. 4

    Voer de test uit en bekijk de controles

    Bekijk de controles voor HTTP-status, origin, methode, headers en credentials naast de teruggestuurde CORS-headers. Controleer daarna het daadwerkelijke verzoek in je browser.

Wat het resultaat betekent

Een geslaagde test betekent dat het OPTIONS-antwoord voldoet aan de controles van deze test voor jouw instellingen. Het daadwerkelijke antwoord heeft nog steeds eigen CORS-toestemming nodig. Authenticatie, omleidingen, cookiebeperkingen en verschillen tussen jouw netwerk en onze server kunnen het browserverzoek ook beïnvloeden.

Een mislukte OPTIONS-test bewijst niet dat elk verzoek naar een andere origin zal mislukken. Sommige GET-, HEAD- en POST-verzoeken voldoen aan de CORS-safelist en hebben geen preflight nodig. Deze tool test altijd OPTIONS en onderzoekt geen verzoekbody of headerwaarden.

CORS-antwoordheaders

Header Betekenis
Access-Control-Allow-Origin Moet de origin van het verzoek toestaan. De wildcard * werkt alleen als de credentialsmodus niet include is.
Access-Control-Allow-Methods Staat methoden toe die preflighttoestemming nodig hebben, zoals PUT, PATCH en DELETE. GET, HEAD en POST staan op de safelist voor methoden.
Access-Control-Allow-Headers Staat de opgegeven headernamen toe. Authorization moet expliciet worden vermeld; een wildcard geldt niet voor deze header.
Access-Control-Allow-Credentials Moet precies true zijn als het beoogde verzoek credentialsmodus include gebruikt.
Access-Control-Max-Age Geeft aan hoelang een browser preflighttoestemming mag cachen, binnen de limieten van die browser.
Access-Control-Expose-Headers Bepaalt welke headers uit het daadwerkelijke antwoord JavaScript mag lezen. Verleent geen preflighttoestemming.

Bij credentialsmodus include worden wildcards in Allow-Methods en Allow-Headers behandeld als het letterlijke teken *, niet als toestemming voor elke methode of header. Headernamen zijn niet hoofdlettergevoelig; methodenamen wel.

Voorbeeld: JSON versturen met POST

Stel dat een pagina op https://example.com een POST-verzoek naar https://api.example.com/items verstuurt met Content-Type: application/json en een Authorization-header. Voer dat endpoint in, kies POST, gebruik https://example.com als origin en voer content-type, authorization in als headernamen.

De test kondigt die namen aan via Access-Control-Request-Headers. Hij verstuurt geen JSON, bearertoken of cookies. Een browser voert voor dit verzoek normaal een preflight uit, omdat het JSON-contenttype en Authorization niet onder de CORS-safelist voor verzoekheaders vallen.

Een mislukte controle oplossen

Beantwoord OPTIONS met een succesvolle 2xx-status en de CORS-toestemmingen die je applicatie nodig heeft. Controleer een origin aan de hand van je lijst met toegestane origins voordat je hem terugstuurt. Als de toegestane origin per verzoek verschilt, gebruik dan Vary: Origin zodat caches antwoorden uit elkaar houden. Zet de juiste origin- en credentialsheaders ook op daadwerkelijke antwoorden, inclusief foutantwoorden die je app moet kunnen lezen.

Raadpleeg de CORS-handleiding van MDN, de uitleg over preflight, de referentie voor toegestane headers, de referentie voor toegestane methoden en de Fetch Standard voor de protocoldetails.

Veelgestelde vragen

Nee. De gekozen methode wordt als Access-Control-Request-Method meegestuurd in een OPTIONS-test. De tester verstuurt niet het beoogde verzoek, de bijbehorende body, cookies of authenticatiewaarden.

Het beoordeelt het antwoord alsof je beoogde browserverzoek credentialsmodus include gebruikt. Daarvoor zijn een specifiek toegestane origin en Access-Control-Allow-Credentials: true nodig. Het selectievakje meldt je niet aan en verstuurt geen credentials.

Het daadwerkelijke antwoord kan andere CORS-headers hebben dan OPTIONS. Je browser kan ook te maken krijgen met een omleiding, een gecachte preflight, een netwerkbeperking of mislukte authenticatie. Bekijk zowel OPTIONS als het daadwerkelijke verzoek in het netwerkpaneel van je browser.

Nee. Een verzoek met een methode op de safelist, toegestane headerwaarden en de overige safelistvoorwaarden kan de preflight overslaan. Dat geldt bijvoorbeeld vaak voor een GET zonder aangepaste headers. Een POST met Content-Type: application/json heeft normaal wel een preflight nodig.

Browsers handhaven CORS bij het bepalen of scripts op een pagina een antwoord van een andere origin mogen lezen. Een client op een server kan het antwoord ontvangen zonder die browsercontrole. Alleen HTTP 200 ontvangen bewijst niet dat JavaScript in de browser het antwoord kan lezen.

Nee. CORS regelt browsertoegang tot antwoorden van andere origins. Je endpoint heeft nog steeds eigen authenticatie, autorisatie en eventuele CSRF-bescherming nodig. Sommige verzoeken naar een andere origin bereiken de server ook als de browser weigert het antwoord beschikbaar te stellen.

Gerelateerde tools

Tool beschikbaar in andere talen