cURL to JavaScript Converter

You captured a network request in Chrome DevTools and need to replay it in JavaScript. Manually translating -H flags, auth headers, and request bodies into a fetch() call is tedious and easy to get wrong. This tool does it for you in milliseconds — paste the cURL command and get production-ready JavaScript fetch code.

Why fetch() Instead of XMLHttpRequest?

The Fetch API is the modern standard for making HTTP requests in JavaScript. It ships natively in all modern browsers and in Node.js 18+, with no dependencies required. Compared to XMLHttpRequest, fetch uses Promises, which pairs naturally with async/await for readable, maintainable code. The output from this converter uses the async/await pattern so it drops directly into any modern JavaScript or TypeScript codebase.

How the Conversion Works

The converter parses every flag from your cURL command and maps them to fetch options:

Multiline cURL commands using backslash line continuation are joined before parsing, so commands copied directly from Chrome or Firefox DevTools work without any editing.

Using the Generated Code in Node.js

Node.js 18+ includes a global fetch implementation. For projects on Node.js 16 or earlier, install the node-fetch package:

npm install node-fetch

Then add import fetch from 'node-fetch'; at the top of the generated file. In Node.js 18+, no import is needed — the generated code runs as-is.

Handling JSON Responses

The generated code calls response.text() to capture the raw response. If your API returns JSON, replace that line with response.json() to get a parsed object directly:

const data = await response.json();
console.log(data);

Error Handling Best Practices

The fetch API does not throw errors for HTTP error status codes (4xx, 5xx). It only rejects the Promise for network failures. Always check response.ok or response.status after the await:

if (!response.ok) {
  throw new Error(`HTTP error: ${response.status}`);
}

Adding this check makes your code behave the way developers expect from most HTTP client libraries.

Common Patterns After Converting

Setting a timeout — fetch does not support a built-in timeout. Use AbortController:

const controller = new AbortController();
setTimeout(() => controller.abort(), 5000);
const response = await fetch(url, { ...options, signal: controller.signal });

Sending form data — if your cURL uses --data-urlencode, pass a URLSearchParams object as the body instead of a string for proper encoding.

Following redirects — fetch follows redirects automatically by default, matching curl’s -L behavior. To disable this, set redirect: "manual" in the options object.

Frequently Asked Questions

Can I use the output in a browser extension? Yes. The generated fetch() code works in browser extension service workers and content scripts, subject to the extension’s permissions and CSP. Ensure the target URL is listed in host_permissions.

Why does the browser block my request with a CORS error? CORS is a browser security policy enforced on the client side. curl is not subject to CORS. If you see a CORS error in the browser but not in curl, the API server needs to add appropriate Access-Control-Allow-Origin headers for browser clients.

Does the tool support multipart form uploads? The converter handles --data and --data-urlencode flags. For --form (multipart), use a FormData object in JavaScript — the tool outputs the raw body string as a starting point.