Konwerter cURL na Fetch API
Przelicz komendę cURL na kod JavaScript Fetch API w jednym kliknięciu. Obsługa nagłówków, body JSON, autoryzacji Bearer i metod HTTP. Gotowy kod ES6+. Bezpłatnie.
-
1Wprowadź dane
Wpisz treść, wklej tekst lub załaduj plik z dysku. -
2Kliknij przycisk
Narzędzie natychmiast przetworzy Twoje dane w przeglądarce. -
3Pobierz wynik
Skopiuj gotowy tekst lub zapisz plik na urządzeniu.
return "Wynik gotowy w 0.1s";
}
Metoda HTTP
z flagi -X/--request albo wywnioskowana: body → POST, inaczej GET
Nagłówki
z flagi -H/--header, plus wyliczone Authorization (z -u) i Content-Type (z --json)
Ciało żądania
treść z flagi -d/--data/--json, kodowana wg wybranego trybu body
Rozmiar wyniku
gotowy kod fetch() do wklejenia
(async () => {
const url = "https://api.example.com/v1/messages";
const res = await fetch(url, {
method: "POST",
headers: {
"Authorization": "Bearer YOUR_TOKEN",
"Content-Type": "application/json"
},
body: JSON.stringify({"text":"Hello from Toolsti"})
});
if (!res.ok) throw new Error(`HTTP ${res.status}`);
const contentType = res.headers.get("content-type") || "";
const data = contentType.includes("application/json") ? await res.json() : await res.text();
console.log(data);
})();
| Polecenie cURL | Metoda | Wynik fetch() |
|---|---|---|
| curl -X POST https://api.example.com/wpisy -H "Content-Type: application/json" -d '{"tytul":"Cześć"}' | POST | const url="https://api.example.com/wpisy";fetch(url,{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify({"tytul":"Cześć"})}).then(r=>{if(!r.ok)throw new Error(`HTTP ${r.status}`);const ct=r.headers.get("content-type")||"";return ct.includes("application/json")?r.json():r.text()}).then(d=>console.log(d)).catch(e=>console.error(e)); |
| Flaga cURL | Znaczenie | Co robi konwerter |
|---|---|---|
| -X, --request | metoda HTTP | trafia do method w fetch() |
| -H, --header | nagłówek „Nazwa: wartość” | trafia do headers w fetch() |
| -d, --data, --data-raw | ciało żądania | trafia do body (JSON.stringify / URLSearchParams wg trybu); bez -X metoda staje się POST |
| -u, --user | login:hasło | nagłówek Authorization: Basic + base64 (gdy nie ma własnego Authorization) |
| --json | ciało JSON | body + nagłówki Content-Type i Accept: application/json |
| -I, --head | żądanie HEAD | method: "HEAD" |
| -L, --location | podążaj za przekierowaniami | pomijane — fetch domyślnie podąża (redirect: "follow") |
| -k, --insecure, -s, -S | opcje sterowania curl | pomijane — fetch nie ma bezpośrednich odpowiedników |
| --compressed, --fail, --globoff | opcje sterowania curl | pomijane — zachowanie fetch jest zbliżone domyślnie |
Ten sam zestaw żądań w PowerShell obsłuży Invoke-RestMethod — np. curl -X POST z -d i -H „Content-Type: application/json” to Invoke-RestMethod -Method Post -ContentType "application/json" -Body '…'. W Windows PowerShell 5.1 nazwa curl jest aliasem Invoke-WebRequest; w PowerShell 7 alias usunięto i curl odpala prawdziwy curl.exe.
Warto wiedzieć — cURL i Fetch API w praktyce
Metoda: curl zgaduje, fetch nie
curl z flagą -d sam zmienia metodę na POST, ale fetch() bez jawnego method zostaje przy GET. Konwerter dlatego zawsze zapisuje metodę wprost (method: "POST") — zachowanie żądania jest identyczne z oryginałem.
Ciało: JSON, formularz czy surowy tekst
Tryb auto rozpoznaje JSON po nawiasach klamrowych (→ JSON.stringify), zapis a=b&c=d (→ URLSearchParams), a resztę przepisuje jako surowy string. Można to wymusić ręcznie: json, urlencoded, form (FormData) albo raw.
Uwaga na tokeny w poleceniach
Nagłówek Authorization: Bearer … przechodzi do fetch() bez zmian, ale polecenia curl z produkcyjnymi tokenami zostają też w historii powłoki i schowku. Do testów używaj tokenów jednorazowych albo zmiennych środowiskowych.
Dlaczego fetch rzuca tylko na błąd sieci
fetch() nie traktuje statusów 4xx/5xx jako błędów — zwraca zwykłą odpowiedź z res.ok = false. Dlatego wygenerowany kod zawiera sprawdzenie !r.ok z rzuceniem Error(`HTTP ${r.status}`), co odwzorowuje zachowanie curl (kod wyjścia ≠ 0 przy błędzie HTTP z --fail).
Oceń to narzędzie:
Powiązane narzędzia
Inne narzędzia, które mogą Ci się przydaćKonwerter cURL na Fetch API – JavaScript ES6+ w sekundę
Polecenie cURL to narzędzie terminalowe do wysyłania żądań HTTP – idealne do testowania API z wiersza poleceń. Fetch API to natywny standard przeglądarek i Node.js do tego samego celu. Narzędzie tłumaczy składnię cURL (flagi -H, -d, -X, -u) na równoważny kod JavaScript z async/await lub Promise chain.
Mapowanie flag cURL na Fetch
curl -X POST → method: "POST". curl -H "Content-Type: application/json" → headers: {"Content-Type":"application/json"}. curl -d '{"key":"val"}' → body: JSON.stringify({key:"val"}). curl -u user:pass → headers: {Authorization: "Basic "+btoa("user:pass")}. curl -b "cookie=val" → headers: {Cookie: "cookie=val"}.
Autoryzacja – wszystkie typy
Bearer token: curl -H "Authorization: Bearer TOKEN" → headers: {Authorization: "Bearer TOKEN"}. Basic auth: curl -u user:pass → btoa("user:pass"). API Key w nagłówku: -H "X-API-Key: KEY" → headers: {"X-API-Key":"KEY"}. OAuth: jak Bearer. Cookie-based: -b "session=abc" → credentials: "include" + odpowiedni nagłówek.
Obsługa błędów w Fetch
Fetch NIE rzuca wyjątku przy odpowiedzi HTTP 4xx/5xx – tylko przy błędach sieciowych. Poprawny wzorzec: if (!response.ok) throw new Error(response.status). Narzędzie generuje kod z obsługą błędów: try/catch + sprawdzenie response.ok + logowanie.
Node.js vs przeglądarka
W przeglądarce: natywne fetch (wszystkie nowoczesne przeglądarki + IE11 z polyfill). Node.js 18+: natywne fetch (globalny obiekt). Node.js < 18: paczka node-fetch lub axios. Narzędzie generuje kod kompatybilny z obiema platformami (ES2017 async/await).
Jak konwerter zamienia komendę cURL na kod Fetch
Konwerter nie wykonuje żadnego żądania sieciowego — działa jak tłumacz składni. Pierwszy etap to tokenizacja: polecenie jest dzielone na argumenty z zachowaniem reguł powłoki, więc treść ujęta w cudzysłowy (na przykład obiekt JSON podany po fladze -d) jest traktowana jako jeden token, a nie jako kilka osobnych. Dzięki temu przecinki, dwukropki i nawiasy w ciele żądania nie rozbijają polecenia na przypadkowe fragmenty.
Drugi etap to rozpoznanie roli każdego tokenu. Argument bez flagi, który występuje jako pierwszy, jest adresem URL i trafia do wywołania fetch. Tokeny zaczynające się od myślnika są porównywane z mapą flag: -X ustawia metodę, -H dodaje nagłówek, -d dostarcza ciało żądania, a -u oraz -b opisują uwierzytelnianie i pliki cookie. Wynik rozpoznania ląduje w pośrednim obiekcie konfiguracji, w którym każda flaga ma już przypisane miejsce — dzięki temu kolejność flag w poleceniu nie ma znaczenia dla wyniku.
Trzeci etap to renderowanie szablonu JavaScriptu. Konwerter ustala wartości domyślne (brak flagi -X oznacza metodę GET, a użycie -d bez -X oznacza POST), decyduje o formie ciała żądania — dane JSON są przepuszczane przez JSON.stringify zamiast wklejane jako surowy tekst — i składa gotowy blok kodu z async/await oraz obsługą błędów. Ten sam szkielet działa w przeglądarce i w Node.js, bo opiera się na standardzie ES2017. Przy powtórzonych nazwach nagłówków wartości są łączone w jednym obiekcie headers, zamiast tworzyć kilka konkurencyjnych wpisów.
Przykład krok po kroku: POST z nagłówkiem i danymi JSON
Analizujemy jedno konkretne polecenie: curl -X POST https://api.example.com/users -H "Content-Type: application/json" -H "Authorization: Bearer TOKEN" -d '{"name":"Anna","role":"admin"}'.
- Wklej całe polecenie do pola narzędzia w jednej linii. Jeśli skopiowałeś je z dokumentacji, usuń backslashe z końców wierszy — są znakami kontynuacji powłoki, a nie częścią adresu ani nagłówków.
- Konwerter dzieli tekst na tokeny. Adres https://api.example.com/users zostaje rozpoznany jako cel żądania, a kolejne pary flaga-wartość jako modyfikatory.
- Flaga -X POST ustawia pole method na POST. Gdyby jej nie było, a w poleceniu nadal występowałoby -d, konwerter i tak wygenerowałby POST.
- Obie flagi -H trafiają do jednego obiektu headers: Content-Type: application/json oraz Authorization o wartości Bearer TOKEN.
- Wartość po -d jest rozpoznawana jako JSON, więc zamiast surowego tekstu powstaje JSON.stringify z obiektem o polach name i role.
- Wynikiem jest funkcja asynchroniczna, w której await fetch otrzymuje adres oraz obiekt konfiguracji z metodą, nagłówkami i ciałem; odczyt odpowiedzi następuje po sprawdzeniu response.ok, a całość jest objęta blokiem try/catch.
Mapa odniesienia: element cURL i jego odpowiednik w Fetch
| Element cURL | Odpowiednik w Fetch | Uwagi |
|---|---|---|
| Adres po flagach | fetch(url) | Pierwszy argument wywołania |
| -X POST | method: "POST" | Brak flagi -X oznacza metodę GET |
| -d z danymi JSON | body: JSON.stringify(...) | Wymaga nagłówka Content-Type: application/json |
| -H "X-API-Key: KEY" | headers: {"X-API-Key":"KEY"} | Każda flaga -H to jeden wpis w obiekcie headers |
| -u user:pass | Authorization: Basic + btoa(user:pass) | Dane logowania nie trafiają do adresu URL |
| -b "cookie=val" | Nagłówek Cookie lub credentials: include | Wybór zależy od tego, kto zarządza ciasteczkami |
| Kilka flag -H | Jeden obiekt headers | Nazwy nagłówków są scalane, bez duplikatów |
| Brak -d | Brak pola body | Żądanie GET nie powinno nieść ciała |
Jak korzystać z konwertera, żeby nie poprawiać kodu
- Wklejaj polecenie w jednej linii — znaki kontynuacji wiersza i wcięcia z dokumentacji API psują tokenizację, a poprawianie ich ręcznie w wygenerowanym kodzie zajmuje więcej czasu niż sklejenie polecenia przed wklejeniem.
- Sprawdź rodzaj cudzysłowów — JSON najbezpieczniej podawać w apostrofach, bo wtedy cudzysłowy wewnątrz obiektu nie kończą argumentu. Po konwersji upewnij się, że wartość po -d nadal jest poprawnym obiektem, a nie tekstem z uciętym końcem.
- Trzymaj sekrety poza kodem — token z nagłówka Authorization zastąp zmienną środowiskową albo placeholderem i podstawiaj wartość w czasie działania aplikacji, zamiast zostawiać ją na stałe w pliku źródłowym.
- Testuj najpierw po stronie serwera — ten sam kod uruchomiony w Node.js nie podlega ograniczeniom przeglądarki, więc pozwala szybko odróżnić błąd w żądaniu od blokady CORS.
- Ustal format ciała żądania — jeśli po -d znajdują się pary klucz=wartość, to zwykle formularz, a nie JSON. W takim wypadku użyj URLSearchParams albo FormData i odpowiedniego nagłówka, zamiast przepuszczać dane przez JSON.stringify.
Czego konwerter nie uwzględni
- Różnice powłok — narzędzie zakłada składnię powłoki POSIX. Polecenia kopiowane z PowerShella lub wiersza poleceń systemu Windows mogą używać innych zasad cytowania i escapowania, więc wynik wymaga ręcznej weryfikacji.
- Zmienne i podstawienia — odwołania do zmiennych środowiskowych, backticki czy wynik działania innego polecenia nie są rozwiązywane. W kodzie pojawi się dosłowny tekst, który trzeba zastąpić konkretną wartością.
- Pliki, potoki i strumienie — wczytywanie ciała z pliku, wysyłka danych binarnych, wieloczęściowe przesyłanie plików oraz przekierowanie odpowiedzi do pliku nie mają prostego odpowiednika w fetch i nie są tłumaczone automatycznie.
- CORS, certyfikaty i proxy — wygenerowany kod w przeglądarce podlega polityce tego samego pochodzenia, a pomijanie weryfikacji certyfikatu czy konfiguracja serwera pośredniczącego wymagają dodatkowych ustawień po stronie środowiska uruchomieniowego, których szablon nie zawiera.
Najczęstsze pytania
Jakie ograniczenia ma Fetch vs cURL?
CORS (Cross-Origin Resource Sharing): przeglądarka blokuje żądania do innych domen bez nagłówka Access-Control-Allow-Origin. cURL nie ma tego ograniczenia (działa server-side). Rozwiązanie: proxy własny endpoint lub użyj cURL do bezpośrednich wywołań API z backendu.
Jak przekonwertować multipart/form-data w cURL?
curl -F "[email protected]" → new FormData() + append("file", fileBlob). curl -F "field=value" → formData.append("field","value") + fetch(url, {method:"POST", body: formData}). Nie ustawiaj Content-Type ręcznie – przeglądarka ustawi go z boundary.
Jaka jest różnica między Fetch a XMLHttpRequest?
XMLHttpRequest (XHR): stary API, callback-based, działa w IE. Fetch: Promise-based, czytelniejszy, obsługuje async/await, nie ma onprogress dla uploadu (do tego ReadableStream lub XHR). Axios opakowuje XHR ale ma podobny interfejs do Fetch.
Czy Fetch obsługuje timeout?
Natywnie nie. Workaround: AbortController + AbortSignal.timeout(5000) (Chrome 103+): fetch(url, {signal: AbortSignal.timeout(5000)}). Lub ręcznie: const controller = new AbortController(); setTimeout(()=>controller.abort(), 5000); fetch(url, {signal: controller.signal}).
Jak debugować żądania Fetch w Chrome DevTools?
Network tab → Fetch/XHR. Kliknij żądanie → Headers, Payload, Response, Timing. Kopiuj jako cURL: prawy klik → Copy → Copy as cURL (można wkleić tutaj do konwersji). Console: window.fetch = ... do monkey-patchowania.
Jak zamienić wieloliniowe polecenie curl na fetch?
Najpierw sklej polecenie w jeden wiersz, usuwając backslashe kończące linie i zbędne wcięcia. Dopiero tak przygotowany tekst wklej do konwertera — wtedy tokenizacja przebiega poprawnie, a JSON w ciele żądania nie zostaje rozbity na fragmenty.
Czy konwerter obsługuje wiele nagłówków w jednym poleceniu?
Tak, każda flaga -H tworzy osobny wpis, ale wszystkie trafiają do jednego obiektu headers. Jeśli ta sama nazwa nagłówka powtarza się kilkukrotnie, wartości są łączone, więc nie powstaje kilka sprzecznych kluczy.
Jak wysłać dane formularza zamiast JSON?
Rozpoznaj, co realmente zawiera wartość po fladze -d. Gdy są to pary klucz=wartość, użyj URLSearchParams i nagłówka application/x-www-form-urlencoded; gdy przesyłasz pliki, właściwym wyborem jest FormData i typ multipart/form-data.
Co zrobić, gdy w poleceniu curl występuje zmienna, na przykład token dostępu?
Konwerter nie rozwiązuje zmiennych powłoki, więc wpisze ją dosłownie. Wstaw w to miejsce placeholder i podstaw wartość w kodzie, na przykład ze zmiennej środowiskowej albo z konfiguracji aplikacji.
Czy fetch sam obsługuje przekierowania i limit czasu?
Przekierowania są obsługiwane domyślnie, choć można zmienić to zachowanie opcją redirect. Natomiast limit czasu nie istnieje jako wbudowany parametr — trzeba użyć AbortController i przerwać żądanie po upływie założonego czasu.
Powiązane narzędzia: konwerter Fetch API na cURL, generator testowego JSON API i walidator JSON.