CORS Guide

Cross-Origin Resource Sharing (CORS) is a security feature that allows web applications to make requests to servers that are on different origins. This guide will help you understand CORS and how to implement it in your web applications.

What is CORS?

CORS is a security mechanism that restricts web applications from making requests to domains other than the one that served the web page. This is to prevent malicious websites from reading sensitive data from other websites.

How CORS Works

When a web application makes a request to a server, the server checks the origin of the request. If the origin is not allowed to access the resource, the server responds with an error.

Steps to Implement CORS

Enable CORS on the Server: The server needs to be configured to allow requests from different origins. This can be done by setting the Access-Control-Allow-Origin header in the response.
```
Access-Control-Allow-Origin: *
```
The * allows requests from all origins. You can also specify a particular origin.
Handle Pre-flight Requests: When a web application makes a request to a server, the browser sends a pre-flight request to check if the actual request is allowed. The server needs to respond with the appropriate headers to allow the actual request.
Use Credentials: If the request requires credentials (like cookies), the server needs to set the Access-Control-Allow-Credentials header to true.

Example

Here's an example of a server response with CORS headers:

HTTP/1.1 200 OK
Access-Control-Allow-Origin: https://example.com
Access-Control-Allow-Methods: GET, POST, PUT, DELETE
Access-Control-Allow-Headers: Content-Type, Authorization
Access-Control-Allow-Credentials: true
Content-Type: application/json

Learn More

For more information on CORS, you can read the MDN documentation.