What is a CORS preflight request?

A preflight is an OPTIONS request the browser sends before the actual request to check if the server allows the cross-origin request. It is triggered by non-simple methods (PUT, PATCH, DELETE) or custom headers.

Why does CORS block my request?

CORS blocks requests when the server response does not include the correct Access-Control-Allow-Origin header matching your page origin, or when required methods/headers are not listed in the preflight response.

Can I use Access-Control-Allow-Origin: * with credentials?

No. When the request includes credentials (cookies, HTTP auth), the server must respond with the specific origin, not the wildcard *. The browser will block the response otherwise.

What is a simple request in CORS?

A simple request uses GET, HEAD, or POST with only safe headers (Accept, Accept-Language, Content-Language, Content-Type with form/text values). Simple requests skip the preflight check.

Tools

CORS Debugger

Will the browser let this page call that API? Describe the request and the server's CORS headers to get a verdict, the exact preflight, the console error you would see, and a server config that fixes it.

Try a scenario

1 · The browser request

Page origin

Where your JavaScript runs. Scheme, host, port; no path or trailing slash.

Request URL

Method

Content-Type

Custom request headersref

Comma separated names, e.g. Authorization, X-Custom.

Response headers your code reads

Optional. Checks they are exposed, e.g. X-Total-Count, Location.

Send credentials (credentials: 'include', cookies)

2 · The server response

Access-Control-Allow-Originref

Access-Control-Allow-Methodsref

Access-Control-Allow-Headersref

Access-Control-Expose-Headers

Access-Control-Max-Ageref

Preflight status

Access-Control-Allow-Credentials: trueVary: Origin ref

URLs, exact origins, and header values are never included.

Blockedpreflightedfails at OPTIONS preflight

Wildcard origin with credentials

When the request includes credentials (cookies, HTTP auth, client certs), Access-Control-Allow-Origin must be the exact origin, never *.

Why a preflight: PUT is not a CORS-safelisted method (only GET, HEAD, POST are); non-safelisted request header: authorization; Content-Type "application/json" is not one of application/x-www-form-urlencoded, multipart/form-data, text/plain.

Browser console error

Access to fetch at 'https://api.example.com/data' from origin 'https://myapp.com' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: The value of the 'Access-Control-Allow-Origin' header in the response must not be the wildcard '*' when the request's credentials mode is 'include'.

How to fix it

Replace * with the exact origin (https://myapp.com), echoed from an allowlist, add Vary: Origin, and keep Access-Control-Allow-Credentials: true.

Preflight (OPTIONS)

> OPTIONS /data HTTP/1.1

> Host: api.example.com

> Origin: https://myapp.com

> Access-Control-Request-Method: PUT

> Access-Control-Request-Headers: authorization,content-type

< HTTP/1.1 204 No Content

< Access-Control-Allow-Origin: *

< Access-Control-Allow-Credentials: true

< Access-Control-Allow-Methods: GET, POST

< Access-Control-Allow-Headers: Content-Type

< Access-Control-Max-Age: 86400

The browser sends this automatically before your request. See Access-Control-Request-Method.

Server config that works for this request

Generated from the request above (origin, method, headers, credentials) and clamped to what browsers honour. Answer OPTIONS before authentication.

import cors from 'cors'

// Register BEFORE auth middleware so OPTIONS preflights are not rejected.
app.use(cors({
  origin: ['https://myapp.com'],          // exact origins from an allowlist
  methods: ['GET', 'POST', 'PUT'],
  allowedHeaders: ['content-type', 'authorization'],
  credentials: true,
  maxAge: 7200,
  optionsSuccessStatus: 204,
}))

CORS reference

Read the CORS guide for how cross-origin requests work end to end, or the compare page CORS vs CSP. Header references: Access-Control-Allow-Origin, Access-Control-Allow-Methods, Access-Control-Allow-Headers, Access-Control-Allow-Credentials, Access-Control-Max-Age, Access-Control-Request-Method, Access-Control-Request-Headers, Origin and Vary.