UtilityKit

500+ fast, free tools. Most run in your browser only; Image & PDF tools upload files to the backend when you run them.

cURL to Fetch

Convert common cURL commands to fetch()

About cURL to Fetch

Every browser DevTools panel has a 'Copy as cURL' option — it is the fastest way to replay a request. But your codebase is JavaScript, and what you actually need is a fetch() call you can paste into an async function. Rewriting cURL flags by hand is error-prone: -H becomes a headers object, -d becomes body with JSON.stringify, -u becomes a Base64-encoded Authorization header, and -X maps to the method property. Miss one detail and the API responds with 401 or 400 instead of the data you need. This tool converts any cURL command into a clean, ready-to-run fetch() snippet in one paste. Headers, method, body, and auth flags are all mapped automatically. The conversion runs entirely in your browser so Bearer tokens and session cookies in the cURL string never touch a server.

Why use cURL to Fetch

Headers Translated

Every -H flag in your cURL command becomes a proper key-value entry inside the fetch headers object, preserving header names and values exactly as the server expects them, including Authorization, Content-Type, and custom API keys.

Body Handling

JSON bodies passed via -d, form bodies via --data-urlencode, and multipart uploads are all detected and converted to the correct fetch body format, with JSON.stringify wrapping applied automatically where the content type is application/json.

Method Mapping

The -X flag for POST, PUT, PATCH, and DELETE is translated to the method property. GET requests with no explicit -X are correctly emitted without a method override, matching the fetch default behavior.

Auth Flag Aware

The -u user:pass Basic Auth shorthand is converted to a proper Authorization: Basic header using btoa encoding, so you do not have to manually compute the Base64 string or remember the header format.

Copy-Pastable Output

The generated fetch() snippet is formatted with consistent indentation, ready to drop directly into an async function. No extra cleanup is needed — paste it, add your response handling, and you are done.

Local Conversion

The entire conversion happens inside your browser using JavaScript string parsing. Bearer tokens, session cookies, and API keys embedded in the cURL command are never transmitted to any server.

How to use cURL to Fetch

Open your browser DevTools Network tab, right-click any request, and choose 'Copy as cURL'
Paste the full cURL command into the input area on this page
Watch the equivalent fetch() call generate instantly in the output panel
Review the headers object, method, and body to confirm correctness
Copy the JavaScript snippet and paste it into your async function or file
Add .then() / await response.json() and error handling before shipping

When to use cURL to Fetch

You copied a request from Chrome or Firefox DevTools Network panel and need it as JavaScript fetch code
You are migrating a shell script that uses cURL to a Node.js service and need idiomatic fetch calls
You received a cURL example from an API vendor's documentation and want to run it in a browser environment
You are writing integration tests in JavaScript and need to reproduce exact requests captured in DevTools
You want to verify that a fetch call you wrote matches the raw HTTP request a cURL command would send
You need to convert a cURL one-liner into a reusable function without manually parsing every flag

Examples

POST with JSON body

Input: curl -X POST https://api.example.com/users -H "Content-Type: application/json" -d '{"name":"Alice"}'

Output: fetch('https://api.example.com/users', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ name: 'Alice' }) })

GET with bearer token

Input: curl https://api.example.com/me -H "Authorization: Bearer abc123"

Output: fetch('https://api.example.com/me', { headers: { 'Authorization': 'Bearer abc123' } })

Basic auth shorthand

Input: curl -u alice:secret https://api.example.com/protected

Output: fetch('https://api.example.com/protected', { headers: { 'Authorization': 'Basic ' + btoa('alice:secret') } })

Tips

After conversion, add credentials: 'include' if the original cURL used session cookies that need to travel with the browser request.
DevTools-copied cURL commands often include browser-specific headers like sec-ch-ua and sec-fetch-site — trim those before using in a non-browser context.
Use AbortController with a setTimeout to mirror cURL's --max-time flag and prevent hung requests in production code.
For Node.js 18+ you can use the built-in fetch directly; for older versions, replace it with the undici or node-fetch package.
If a converted header value contains embedded quotes, verify the output escaping before pasting into a string literal.

Frequently Asked Questions

Does this support multipart form-data uploads?▾

Yes. cURL -F flags are detected and converted to a FormData object appended in the fetch body. The Content-Type multipart boundary is left to the browser to set automatically, which is the correct approach.

What is the difference between fetch and axios?▾

fetch is a built-in browser and Node.js API that returns a Promise resolving to a Response object. axios is a third-party library that provides a higher-level API with automatic JSON parsing, request interceptors, and broader browser compatibility. The converted fetch code works natively without any dependencies.

Why does my fetch fail with CORS when cURL works?▾

cURL sends a direct HTTP request with no origin header, bypassing CORS entirely. Browsers enforce CORS and will block responses unless the server includes the correct Access-Control-Allow-Origin header. This is a server-side configuration issue, not a problem with the converted fetch code.

How do I send cookies with fetch?▾

Add credentials: 'include' to the fetch options object. This tells the browser to attach cookies for the target origin, mirroring what cURL does when you use the -b or --cookie flag.

Does it convert -X PATCH and DELETE correctly?▾

Yes. Any value passed to -X is mapped to the method property of the fetch options, including PATCH, DELETE, HEAD, and OPTIONS.

What about cURL's --data-urlencode flag?▾

The --data-urlencode flag is detected and the value is percent-encoded appropriately. The resulting fetch body uses application/x-www-form-urlencoded with the encoded key-value pairs.

Will the output handle file uploads?▾

The converter generates the FormData structure for multipart uploads, but actual File objects must be provided at runtime by your code. The converter cannot replicate the file reference from a local path in a cURL command.

Can I convert the result back to cURL?▾

This tool converts one direction: cURL to fetch. For the reverse, UtilityKit's fetch-to-curl tool handles that conversion, or you can use browser DevTools to capture the outgoing request and copy it as cURL.

Explore the category

Glossary

cURL: A command-line tool for transferring data with URLs. It supports dozens of protocols and is the de facto standard for testing HTTP APIs from a terminal.
fetch: A browser and Node.js built-in API for making HTTP requests. It returns a Promise and is the modern replacement for XMLHttpRequest in web applications.
HTTP method: The verb that describes the intended action of an HTTP request: GET retrieves data, POST submits data, PUT replaces a resource, PATCH updates it partially, and DELETE removes it.
Header: A key-value pair sent with an HTTP request or response to convey metadata such as content type, authorization credentials, caching directives, or custom application context.
Request body: The optional data payload sent with POST, PUT, or PATCH requests. Common formats include JSON (application/json) and form-encoded data (application/x-www-form-urlencoded).
CORS: Cross-Origin Resource Sharing is a browser security mechanism that restricts web pages from making requests to a different origin unless the server explicitly allows it via Access-Control-Allow-Origin headers.