CORS Error Debugger — Free Online Tool

Diagnose cross-origin resource sharing errors and get ready-to-use fix code for your backend framework.

What is CORS?

Cross-Origin Resource Sharing (CORS) is a browser security mechanism that restricts web pages from making requests to a domain different from the one that served the page. When your frontend (e.g., https://myapp.com) makes an API call to a different domain (e.g., https://api.example.com), the browser first checks whether the server explicitly allows it.

If the server doesn't include the proper Access-Control-Allow-Origin headers in its response, the browser blocks the request and throws a CORS error. Importantly, CORS is enforced by the browser — the request still reaches your server, but the browser prevents the JavaScript from reading the response.

Common CORS Errors

  • No 'Access-Control-Allow-Origin' header: The server response is missing the CORS header entirely. Fix: add the header to your server's response.
  • Preflight request doesn't pass: For requests with custom headers or non-simple methods (PUT, DELETE), browsers send an OPTIONS preflight request. Your server must respond correctly to this.
  • Credentials flag: When using cookies or Authorization headers with withCredentials: true, the server must return Access-Control-Allow-Credentials: true and the origin must be specific (not *).
  • Allowed headers mismatch: If your request includes a header not listed in Access-Control-Allow-Headers, the preflight fails.

How to Fix CORS Per Framework

Use the tool above to generate the exact fix for your backend. The general principle is the same across all frameworks: configure your server to return the appropriate Access-Control-Allow-* headers. For production, always specify the exact allowed origins rather than using a wildcard (*), especially when dealing with authenticated requests.

Frequently Asked Questions about CORS

What causes a CORS error?

A CORS error occurs when a browser blocks a cross-origin request because the server response is missing the Access-Control-Allow-Origin header. The browser enforces the Same-Origin Policy — any request from a different domain, port, or protocol triggers a CORS preflight check. Importantly, CORS is enforced by the browser only; the request still reaches your server, but the browser prevents the JavaScript from reading the response.

How do I fix CORS in Express.js?

Install the cors package (npm install cors) and add app.use(cors()) to allow all origins, or specify exact origins: app.use(cors({ origin: 'https://yourdomain.com' })). For requests with cookies or Authorization headers, set credentials: true and never use a wildcard (*) as the allowed origin — you must specify the exact domain.

What is a CORS preflight request?

A preflight is an HTTP OPTIONS request the browser sends automatically before cross-origin requests that use custom headers or non-simple HTTP methods (PUT, DELETE, PATCH). The server must respond to OPTIONS with Access-Control-Allow-Methods and Access-Control-Allow-Headers headers, plus a 200 or 204 status. If the preflight fails, the actual request is never sent.

Why does CORS work in Postman but not in the browser?

CORS is a browser security mechanism — it does not apply to server-to-server communication or tools like Postman, curl, or REST clients. Postman sends requests directly without enforcing same-origin policy, so the request succeeds. In the browser, JavaScript is restricted from reading cross-origin responses unless the server explicitly allows it via CORS headers.

Related Developer Tools