What is cross-origin fetch and how does it work?

What is cross-origin fetch and how does it work?

Cross-origin fetch refers to the ability of a web application to request resources from a different origin (domain) than its own. This is often controlled by CORS (Cross-Origin Resource Sharing) policies.

Why do we need CORS for cross-origin requests?

CORS is needed to prevent malicious websites from making requests to other domains on behalf of a user without their consent. It allows servers to specify who can access their resources.

Can you give me an example of a cross-origin fetch request?

Sure! Here's a simple example using the Fetch API:

fetch('https://api.example.com/data', {
  method: 'GET',
  headers: {
    'Content-Type': 'application/json'
  }
})
.then(response => response.json())
.then(data => console.log(data));

What happens if the CORS policy is not set correctly?

If the CORS policy is not set correctly, the browser will block the request, and you'll see a CORS error in the console, preventing the web application from accessing the resource.