Cross-Origin Resource Sharing (CORS) is een regel in de browser die bepaalt of een pagina geladen vanaf de ene website data mag uitlezen van een andere website. Standaard blokkeren browsers deze verzoeken tussen domeinen, en CORS is de gecontroleerde manier waarop een server ‘ja, deze specifieke site mag het’ zegt.
Denk aan een besloten club. Je browser heeft je lidmaatschapspas op zak, maar de club checkt alsnog een gastenlijst voordat een verzoek van buitenaf ermee naar binnen mag. Als een pagina op shop.voorbeeld.nl iets probeert op te halen bij api.betalingen.nl, vraagt de browser in feite aan de betaalserver: ‘staat shop.voorbeeld.nl op je lijst?’ De server antwoordt met een HTTP header genaamd Access-Control-Allow-Origin. Staat jouw site daarin, dan stroomt de data; zo niet, dan blokkeert de browser het en zie je de bekende melding ‘blocked by CORS policy’.
Bij bepaalde verzoeken checkt de browser eerst met een kleine ‘preflight’ via de OPTIONS-methode, en vraagt zo om toestemming voordat hij het echte verzoek stuurt. Daarom kan een verzoek met een eigen header of een methode als DELETE falen terwijl een gewone GET prima werkt: de server moet die ook toestaan. En onthoud wat CORS wel en niet doet. Het bepaalt of een browser de respons teruggeeft aan JavaScript, niet of de server het verzoek uitvoert, dus het vervangt nooit echte authenticatie.
Daarom zet CORS mensen op het verkeerde been. De fout verschijnt in de browser, maar de instelling die het oplost staat op de API die je aanroept. Beheer je die API zelf, dan voeg je je domein toe aan de toegestane lijst; draait een externe partij hem, dan vraag je hen om jou toe te staan.
Bij TopDevs stellen we CORS bewust in op de API’s die we bouwen, met precies de domeinen die een klant nodig heeft en niet meer, zodat koppelingen werken zonder stilletjes een deur voor iedereen open te zetten.
