# CORS Studio

When the browser blocks a request with a CORS error, paste the request (Origin, method, headers, credentials) and the response headers. The tool says whether the browser allows it and why, header by header, and builds the server settings that allow it.

- URL: https://tools.itlibra.com/en/cors-studio
- On-device・No upload
- Last updated: 2026-10-26

## How to use

1. In the Check tab, enter the page origin, the method, the request header names, the Content-Type value and whether credentials are sent.
2. Paste the headers of the preflight (OPTIONS) response and of the actual response (GET or another real response). You can copy them from the Network tab of developer tools.
3. Read the verdict and the ✓ and ✗ for each header with its fix. If you leave a response empty, the tool says the decision cannot be made yet.
4. In the Make a setting tab, choose the allowed origins, methods and headers. The tool shows the response headers and examples for nginx, Apache, Express and Next.js.

## Use cases

- A fetch call fails with “blocked by CORS policy” and you want to know which Access-Control header causes it
- A JSON POST fails at the preflight and you need to know whether Content-Type or Authorization is the reason
- A request with cookies fails because the server answers with \*, and you want the reason
- You need to allow several site origins in nginx or Express
- You want to know whether Vary: Origin is needed for caching

## What it does

### Checks whether a preflight is needed

Follows the Fetch Standard: the method must be GET, HEAD or POST; the request headers must be safelisted (such as Accept); Content-Type must be application/x-www-form-urlencoded, multipart/form-data or text/plain.

### Per-header CORS checks

Checks Access-Control-Allow-Origin against the request Origin (scheme, port and host name mismatches are explained separately), Allow-Credentials, Allow-Methods, Allow-Headers (the meaning of \* and the Authorization exception), Expose-Headers and Vary: Origin, one row each.

### Common mistakes explained

Shows the fix for \* with credentials, a trailing slash in the origin, null origins, more than one Allow-Origin value, and Set-Cookie in Expose-Headers.

### Settings for nginx, Apache, Express and Next.js

Builds settings that check the request Origin against your allowed list and return only a match. The preflight is answered with 204. The Express example does not use the cors package.


## Supported formats

### Input

- Request origin, method, request header names and the Content-Type value
- Preflight (OPTIONS) response headers, status line optional
- Actual response headers, status line optional


## Capability matrix

| Feature | Support | Notes |
| --- | --- | --- |
| Deciding whether a preflight is needed (Fetch Standard) | Supported | — |
| Per-header CORS checks with fixes | Supported | — |
| Settings for nginx, Apache, Express and Next.js | Supported | — |
| Fetching the real response headers from a URL | Not supported | No network access. Paste the response headers instead |
| Reproducing the browser’s behaviour exactly | Not supported | The verdict follows the specification. Small differences between browsers are not checked |
| Checking authentication or the API body | Not supported | Only the CORS response headers are read |
| Blocking requests from outside browsers (such as curl) | Not supported | CORS is a mechanism that limits what browsers let a page read |

## Limits & notes

- The verdict is based only on the headers you paste. Results in a real browser can differ because of caching, extensions or the browser version.
- The upper limit for how long a preflight result may be reused (Access-Control-Max-Age) differs between browsers. This tool does not state a number for it.
- The request origin must be http or https (or null). Access-Control-Allow-Origin is compared literally with the request origin, so a trailing slash or a different letter case does not match.
- Input limits: 20,000 characters per box, and up to 200 lines of headers.
- Example domains are placeholders. Where a setting goes depends on your proxy, CDN or framework.
- Works on phones too, but PC is recommended for long pasted headers.

## Privacy & safety

The headers, origins and settings you enter are processed only in your browser. Nothing is sent to or stored on a server.

## FAQ

### Why does a CORS error happen?

The browser gives a response from another site to the page’s JavaScript only when the response allows the page’s origin, through Access-Control-Allow-Origin and related headers. Otherwise it reports a CORS error, even when the server is running fine.

### I sent \* in Access-Control-Allow-Origin, but a request with credentials still fails. Why?

With credentials (such as cookies), \* does not match. Return the origin itself and send Access-Control-Allow-Credentials: true.

### What is a preflight (OPTIONS) request?

It is a check the browser sends before a request that uses an unsafe method (such as PUT or DELETE) or an unsafe header (such as Authorization) or an unsafe Content-Type (such as application/json). If the check is not allowed, the actual request is not sent.

### How do I allow several site origins?

Access-Control-Allow-Origin can hold only one value. Check the request Origin against your list, return the match only, and send Vary: Origin. The Make a setting tab shows the code.

### Why is Vary: Origin needed?

It tells caches (a CDN or the browser) that the response depends on the Origin. Without it, a response meant for one origin can be served to another.