CORS Cross-Origin Request

Make a cross-origin HTTP request with CORS headers inspection.

Code

Utilities

const response = await fetch('https://httpbin.org/get', {
  mode: 'cors',
  headers: {
    'X-Custom-Header': 'triggers-preflight'
  }
});

const data = await response.json();
const corsHeaders = {
  'access-control-allow-origin': response.headers.get('access-control-allow-origin'),
  'access-control-allow-methods': response.headers.get('access-control-allow-methods')
};
({ data, corsHeaders });

Browser·fetch() may be limited by CORS

CORS Modes

Mode	Behavior
`cors`	Full CORS request (default for cross-origin)
`no-cors`	Limited response, no JS access to response
`same-origin`	Fail if not same-origin

What Triggers Preflight

Custom headers (X-* headers)
Methods other than GET, HEAD, POST
Content-Type other than form-data, text/plain, application/x-www-form-urlencoded

More JavaScript Snippets

Add Query Parameter

Add or update a query parameter in a URL string.

Bearer Token Authentication

Make an authenticated HTTP request using Bearer token for JWT or OAuth.

Check Cloudflare Cache Status

Check if a resource is served from Cloudflare's cache by inspecting the CF-Cache-Status header.

Delayed Response (Test Timeouts)

Request a delayed response to test timeout handling with AbortController.

Download Binary File

Download an image or binary file and convert it to a blob or base64.

Fetch Error Details

Extract status, headers and body from an HTTP error response.