Basics

• Modern browsers block cross-origin requests by default
• Code executed on different domains, protocols or ports have different origins. A request between them is a "cross-origin".
• CORS does not prevent cross-origin requests. It allows them when configured so.

How it works

The browser sends a set of CORS headers to the cross-origin server which returns specific header values in the response. Based on the header values returned in the response from the cross-origin server, the browser provides access to the response or blocks the access by showing a CORS error in the browser console

!! The request has a header Origin -it's there already, you don't need to add it-. The server processes the request and sends back a response with a header Access-Control-Allow-Origin.

The browser checks the value of Access-Control-Allow-Origin in the response and renders that response only if it's value is the same as the Origin header sent on the request.

Type of CORS requests sent by a browser

There is 3 different kinds of CORS requests depending of the kind of operation that the browser wants to perform in the cross-origin server:

- simple
- preflight
- request with credentials

Simple CORS requests (GET, POST and HEAD)

It doesn't trigger a CORS preflight. BUT IT STILL NEEDS TO MATCH Origin AND Access-Controll-Allow-Origin.
It needs to meet ALL the following conditions:
- be GET, POST or HEAD
- the only headers that can be manually set in the request are:

• Accept
• Accept-Language
• Content-Language
• Content-Type (the only allowed values for Content-Type are the following:)

- application/x-www-form-urlencoded
- multipart/form-data
- text/plain
- no event listeners are registered to the XMLHttpRequest (like for example XMLHttpRequest.upload)
- no ReadableStream is used in the request

Preflight requests

For requests that intend to change something in the server -as a PUT or a DELETE-
The preflight request is an OPTION method sent to the cross-origin server so the server checks if it's going to allow the request. 
Along with the preflight request the browser sends the following headers:

• Access-Control-Request-Method: http method of the actual request.
• Access-Control-Request-Headers: A list of geaders that will be sent with the request including any custom headers.
• Origin: same as in simple request.

CORS requests with credentials

For requests with access credentials (like an Authorization header or cookies) the browser will not allow to access the response unless the server sends a CORS header Access-Control-Allow-Credentials with a value of true

FETCH parameters in CORS

mode

las opciones son:

• cors
• no-cors
• same-origin

credentials

For cookies, HTTP authentication and TLS client certificates

the options are:

• omit: Instructs browser to exclude credentials from the request, and ignore any credentials sent back in the response (e.g., any Set-Cookie header).
• same-origin: Instructs browser to include credentials with requests to same-origin URLs, and use any credentials sent back in responses from same-origin URLs.
• include: Instructs browser to include credentials in both same- and cross-origin requests, and always use any credentials sent back in responses.

Referrer policy

referrer header

Indicates the previous site the browser visited.
There might be security concerns about indicating this. To deal with this problems we have an http header called "Referrer-Policy".