What is Cross-Origin Resource Sharing (CORS)?

CORS is an HTTP header-based mechanism that allows a server to indicate any other domain, scheme, or port origin to allow the resources to be loaded.

Example

Here is an example of a same-origin request: Front-end at educative.io makes an XMLHttpRequest for educative.io/shot.json

CORS

To prevent attacks on websites, browsers restrict cross-origin HTTP requests from scripts. XMLHttpRequest and Fetch API follow the same-origin policy and can only process requests from the same place the application was loaded.

CORS can be enabled for:

  • XMLHttpRequest or Fetch APIs
  • Web Fonts
  • WebGL textures
  • Images/video frames drawn to a canvas using drawImage()
  • CSS Shapes from images

To use CORS, you must add new HTTP headers that allow servers to inform which origins you are permitted to use.

For methods other than GET/POST, browsers must “preflight” the request and ask the server’s supported methods within the OPTIONS method. These requests should only be sent after the server approves. More information, such as cookies and Authentication, can also be sent after asking the server.

In the case of a CORS failure, an error will display in the console of the browser.

Learn, “How cross-origin policy works

Free Resources

Copyright ©2025 Educative, Inc. All rights reserved