Skip to main content

CORS Header Builder

Generate the correct Access-Control-* response headers for your API. Choose the allowed origin, methods, headers and credentials, and copy the result into your server config.

Reviewed for accuracy by the Math Ora X team Last updated

About this tool

Generate the correct Access-Control-* response headers for your API. Choose the allowed origin, methods, headers and credentials, and copy the result into your server config.

Example

Input: origin *, GET POST

Output: Access-Control-Allow-Origin: *...

Privacy

This tool runs entirely in your browser. Your data is processed locally and never uploaded to a server.

How to use this tool

  1. Enter the origin your frontend is allowed to call from, such as a single domain or a wildcard if your setup allows it.
  2. Choose the HTTP methods your API should accept, like GET, POST, or OPTIONS.
  3. Add the request headers your browser clients are allowed to send, and decide whether credentials should be included.
  4. Copy the generated Access-Control-* headers into your server or proxy config.

Step by step, what happens

  1. You provide the CORS settings your API should expose, including allowed origin, methods, headers, and credentials.
  2. The tool formats those choices into the correct Access-Control response headers.
  3. It keeps the output focused on browser CORS behavior, so you can paste it into server config without rewriting header names.
  4. You review the result to make sure it matches your frontend and security rules before deploying it.

Worked example

A backend for a React app on app.example.com needs to allow a POST request with JSON and authentication cookies.

Input: origin: https://app.example.com methods: GET, POST headers: Content-Type, Authorization credentials: true

  1. The tool reads the allowed origin, methods, headers, and the credentials setting from the input.
  2. It converts that setup into CORS response headers that browsers understand.
  3. Because credentials are enabled, it keeps the origin explicit instead of using a wildcard.

Output: Access-Control-Allow-Origin: https://app.example.com Access-Control-Allow-Methods: GET, POST Access-Control-Allow-Headers: Content-Type, Authorization Access-Control-Allow-Credentials: true

Tips and common mistakes

  • Do not use a wildcard origin when credentials are enabled, because browsers reject that combination.
  • Make sure the allowed methods include OPTIONS if your API needs to pass preflight requests.
  • Only list headers your frontend really sends, otherwise you may allow more than you intended.
  • If your API serves multiple trusted origins, generate a separate policy for each one instead of assuming one header fits every case.

Frequently asked questions

What is CORS?

Cross-Origin Resource Sharing controls which web origins may read responses from your API, enforced by browsers.

Why can I not use * with credentials?

The spec forbids wildcard origin when credentials (cookies) are allowed; you must name a specific origin.

Where do these headers go?

Add them to your API's responses in your server or framework configuration.

Facebook Twitter WhatsApp