Fix CORS Blocked Request — Cross Origin Access Denied

Direct answer

CORS errors occur when a browser blocks a cross-origin request because the server response is missing the Access-Control-Allow-Origin header. Configure the backend to handle OPTIONS preflight requests and return the requesting origin in response headers.

Structured breakdown

Cause

CORS errors mean your API server is not sending the right Access-Control-Allow-Origin headers. Configure your backend to respond to OPTIONS preflight requests and include the frontend's origin.

Fix

  • Add Access-Control-Allow-Origin header with your frontend's exact origin
  • Handle OPTIONS requests and return Access-Control-Allow-Methods and Access-Control-Allow-Headers
  • Set Access-Control-Allow-Credentials: true if using cookies or auth headers

Outcome

Cross-origin requests succeed without browser blocking and preflight responses return correct CORS headers.

Common causes

  • Backend missing Access-Control-Allow-Origin header
  • OPTIONS preflight request not handled by the server
  • API gateway or reverse proxy stripping CORS headers
  • Wildcard (*) used with credentials mode
  • Mismatched protocol (http vs https) in origin

Fix steps

  1. 1

    Add Access-Control-Allow-Origin header with your frontend's exact origin

  2. 2

    Handle OPTIONS requests and return Access-Control-Allow-Methods and Access-Control-Allow-Headers

  3. 3

    Set Access-Control-Allow-Credentials: true if using cookies or auth headers

  4. 4

    Check that API gateway/proxy is not stripping CORS headers from responses

  5. 5

    For development, use a dev server proxy instead of disabling CORS entirely

Analyze this issue

Paste the issue description, logs, or symptoms into the fix tool to inspect this problem with your own runtime details.

kintify fix

Need more context?

If the standard steps do not resolve the issue, open the fix tool and include the current logs, configuration, and deployment changes.

Open Fix Tool

Frequently asked questions

Related technical context

These examples show the commands, logs, and configuration patterns most often used to verify this issue.

Command examples

  • curl -I -X OPTIONS https://api.example.com/endpoint -H 'Origin: https://app.example.com'
  • curl -I https://api.example.com/endpoint -H 'Origin: https://app.example.com'

Log snippet

Access to XMLHttpRequest at 'https://api.example.com' from origin 'https://app.example.com' has been blocked by CORS policy:
No 'Access-Control-Allow-Origin' header is present on the requested resource.

Config snippet

// Express CORS middleware
app.use(cors({
  origin: 'https://app.example.com',
  methods: ['GET', 'POST', 'PUT', 'DELETE'],
  credentials: true
}));