An Interest In:
Web News this Week
- March 19, 2024
- March 18, 2024
- March 17, 2024
- March 16, 2024
- March 15, 2024
- March 14, 2024
- March 13, 2024
CORS simplified n how it is enforced
CORS simplified and how it is enforced by browsers
While working in your dev env you may find when a some gui client making a call to one of your api server(local/deployed), we may mostly encounter a CORS exception like the below. So what is this and how we could understand this deep and avoid exceptions.
This is only a security feature which every server brings in to combat CSRF attacks by identifying the host making the request to the servers and also filtering specific headers/method allowed in the request to the server by means of the various properties available from the actual client which comes part of the actual request.Headers
.
CORS more likely comes into picture if we are not making a simple requests (something more than GET request with additional headers). The client tool used (browser or even postman) triggers a preflight (OPTIONS) request.
This preflight request consists of Access-Control-Request-*
Headers to the other server and the server responds back with Access-Control-Allow-*
Headers and this is cached by the browser to handle the future requests to the servers determined by the response header Access-Control-Max-Age
.
This is supported by modern browsers and tools like postman, at the same time some of them provide settings to suppress and other support extensions to override this.
Sample Options request , contains these information as listed below
- What is the current origin for this request
- What is the method requested
- What are the non-standard headers set in request, or sometimes they include content-type if that specific media type is not allowed by default
Origin: https://dev-post.hashnode.devAccess-Control-Request-Method: POSTAccess-Control-Request-Headers: X-PINGOTHER, Content-Type
Sample Options response , which gives the below rules to be followed to the client tool
- The list of Origins supported or
*
to allow all - The methods supported by external server
- The various custom Headers and content-type to be allowed
- The value in seconds which can be used to cache the options response, so that not every api calls are triggering preflight requests. However every browser has a max limt which is enforced when this value is more that the max cache time.
Access-Control-Allow-Origin: https://dev-post.hashnode.dev/apiAccess-Control-Allow-Methods: POST, GET, OPTIONSAccess-Control-Allow-Headers: X-PINGOTHER, Content-TypeAccess-Control-Max-Age: 86400
Browsers can enforce one more security measure on top of this CORS functionality by checking for credentials information in any responses back from the server
Access-Control-Allow-Credentials: true
Irrespective of the type of request we discussed above, if the response contains the above header value, the browser will not let the response back to the invoking script. So what is this Credentials are additional information a fetch or XMLHttpRequest has to specify implicitly to relay the client information like the below.
- HTTP cookies
- HTTP Authentication information
Original Link: https://dev.to/aravindvcyber/cors-simplified-n-how-it-is-enforced-3jn9
Dev To
An online community for sharing and discovering great ideas, having debates, and making friendsMore About this Source Visit Dev To