Wat is CORS (cross-origin resource sharing)?

Een mechanisme dat verzoeken naar andere origins, en het lezen van de antwoorden daarop, die door de same-origin policy worden beperkt, toestaat binnen de grenzen die de server toelaat. De server geeft met antwoordheaders zoals Access-Control-Allow-Origin aan welke origins het antwoord mogen lezen. Voor verzoeken die een eenvoudig verzonden formulier niet kan maken, zoals een POST met Content-Type: application/json, stuurt de browser eerst een controle met de methode OPTIONS (een preflight). Het is een regel die de browser handhaaft, geen mechanisme dat de server tegen aanvallen beschermt.

Japanse benaming: CORS(オリジン間リソース共有)

“CORS (cross-origin resource sharing)” komt voor in 1 oefenvragen uit 1 onderwerpen, bijv. Basis van webtechnologie.

Vakgebied: Basis van webtechnologie

Eenvoudige verzoeken en preflights

GET-verzoeken en POST-verzoeken in formaten die een formulier kan verzenden (application/x-www-form-urlencoded, multipart/form-data, text/plain) worden zonder controle verzonden, en Access-Control-Allow-Origin bepaalt alleen of het script het antwoord mag lezen. Bij verzoeken met andere methoden of Content-Types, of met eigen headers, stuurt de browser eerst OPTIONS en geeft hij in headers zoals Access-Control-Request-Method de methode en de headers op die hij zal gebruiken. Geeft de server toestemming, dan verstuurt de browser het eigenlijke verzoek.

Cookies meesturen

Om cookies mee te sturen met een verzoek naar een andere origin, moet het script credentials opgeven en moet de server Access-Control-Allow-Credentials: true teruggeven. Access-Control-Allow-Origin mag dan niet het jokerteken * zijn, en de toegestane origin moet expliciet worden vermeld. Te veel origins toestaan brengt het risico mee dat andere sites de gegevens van de gebruiker lezen.

Veelvoorkomende misverstanden

Een CORS-fout betekent dat de browser het antwoord niet aan het script heeft doorgegeven; het verzoek zelf kan de server al hebben bereikt. Omdat CORS een regel is die browsers handhaven, houdt het ook geen verzoeken tegen van opdrachtregeltools of andere servers. Om de gegevens van de server te beschermen, zijn daarnaast authenticatie en controle van bevoegdheden nodig.

Nu oefenen: vragen over CORS (cross-origin resource sharing)

JavaScript op een pagina van https://app.example.com gebruikt fetch om een POST-verzoek met een body van Content-Type: application/json naar https://api.example.net/orders te sturen. Welke beschrijving van het gedrag van CORS in dit geval is juist?

  1. ACORS werkt ook buiten browsers, dus zonder toestemming van de server wordt zelfs een POST vanuit een opdrachtregeltool onderweg in het netwerk tegengehouden
  2. BDe browser stuurt eerst een voorafgaande controle (een preflight) met de methode OPTIONS, en verstuurt de eigenlijke POST alleen als de server in zijn headers toestemming geeft
  3. CVerzoeken naar een andere origin worden altijd zonder controle verzonden, en de JavaScript van de pagina kan het antwoord lezen, ook als de server er niets aan toevoegt
Antwoord en toelichting tonen

Antwoord: B. De browser stuurt eerst een voorafgaande controle (een preflight) met de methode OPTIONS, en verstuurt de eigenlijke POST alleen als de server in zijn headers toestemming geeft

CORS is een mechanisme dat verzoeken naar andere origins, en het lezen van de antwoorden daarop, die door de same-origin policy worden beperkt, toestaat binnen de grenzen die de server toelaat. Een POST met Content-Type: application/json is een soort verzoek dat een eenvoudig verzonden formulier niet kan maken, dus de browser gebruikt eerst OPTIONS om de methode en de headers op te geven die hij zal gebruiken en vraagt om toestemming. Geeft het antwoord van de server geen toestemming met headers zoals Access-Control-Allow-Origin, dan verstuurt de browser het eigenlijke verzoek niet. CORS is een regel die de browser handhaaft, dus de server moet zichzelf daarnaast beschermen met authenticatie en controle van bevoegdheden.

Veelgestelde vragen

Kan een CORS-fout aan de kant van de client worden opgelost?

Nee. De server bepaalt welke origins zijn antwoorden mogen lezen, dus de API-server moet de juiste toestemmingsheaders aan zijn antwoorden toevoegen. Bij een API die je niet zelf beheert, kun je die ook via je eigen server aanroepen.

Hoe hangen de same-origin policy en CORS samen?

De same-origin policy verbiedt in principe het lezen van antwoorden van andere origins, en CORS is het mechanisme om binnen de door de server expliciet opgegeven grenzen uitzonderingen toe te staan. Geeft de server geen CORS-toestemming terug, dan blijft de beperking van de same-origin policy gewoon gelden.

“CORS (cross-origin resource sharing)” in de toelichting

Vragen met “CORS (cross-origin resource sharing)” (1)

  1. JavaScript op een pagina van https://app.example.com gebruikt fetch om een POST-verzoek met een body van Content-Type: application/json naar https://api.example.net/orders te sturen. Welke beschrijving van het gedrag van CORS in dit geval is juist?

Verwante termen

Same-origin policy Cookie (HTTP-cookie) DOM (Document Object Model) Event loop HTTP (Hypertext Transfer Protocol) HTTP-methode HTTP-statuscode JSON (JavaScript Object Notation) JWT (JSON Web Token) OAuth

Naar de woordenlijst