Skip to content

Instantly share code, notes, and snippets.

@aredridel
Created April 25, 2019 03:11
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save aredridel/33b4144d6dec1d1aac632d947cf6ae41 to your computer and use it in GitHub Desktop.
Save aredridel/33b4144d6dec1d1aac632d947cf6ae41 to your computer and use it in GitHub Desktop.
This month's attemt to explain CORS.

It sure would be a shame if say, if you clicked a link, the page that loaded could just talk to the whole internet from your computer, right? Imagine the malice.

So browsers stop that shit cold. Nobody would use 'em if every time you got on the web it stole your TV.

Now, javascript can do some limited stuff, since CORS hasn't existed since the dawn of time and it would break large chunks of the web if this suddenly stopped working. It can:

  • Submit forms
  • Load scripts (and therefore make a GET request) from any site.
  • Make any requests back to the site it came from.

It notably cannot, however, read the data returned from these responses in general, nor use any HTTP method fancier than GET and POST, without something saying it's okay. Scripts only run if they are javascript, so despite the request being made, nothing happens unless it's a script.

So if anything wants to do anything fancier, CORS is involved. "Cross Origin" means "from another site" effectively.

When a javascript anything makes a request to a server, it sends an Origin: header. It's like the Referer: header, in that it says some about what page is making the request. It's more vague, since it'd be a shame to have the exact URL you're on matter when you request something from a server. It's simplified down to an 'origin': the scheme (http or https), the hostname, and the port if it's not the usual port. Two examples: https://example.org and http://old.weird.site:9090

Based on this, servers can 👍🏼 or 👎🏼 the request. Remember that it's the browser though that really is deciding this is a rule. The server just says what the browser should do.

If the server sends back Access-Control-Allow-Origin: that matches that origin (wildcards are a thing), the request is allowed. This means for, say, a page on https://example.org/ to read something on https://interestingdata.example, the server for https://interestingexample.com has to say it's cool. It sends back Access-Control-Allow-Origin: https://example.org/ and everything's cool.

A site whose entire purpose is to provide public data might just say *.

That's really most of it. If you want to send cookies or be able to log in to this site, there's more to it. If you want to use fancy methods more than GET and POST, there's a little more. But at its core, the server you're reqesting data to gets to tell your browser whether to let it happen.

Funny thing: you can make a GET request to any site. You just can't read the response. Use this information how you see fit.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment