Sprytne Okazje — promocje, kody rabatowe i wyprzedaże

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.

Bezpieczne (SSL)
Przetwarzanie Lokalne
100% Darmowe
Instrukcja
  • 1
    Wprowadź dane
    Wpisz treść, wklej tekst lub załaduj plik z dysku.
  • 2
    Kliknij przycisk
    Narzędzie natychmiast przetworzy Twoje dane w przeglądarce.
  • 3
    Pobierz wynik
    Skopiuj gotowy tekst lub zapisz plik na urządzeniu.
function runTool() {
  return "Wynik gotowy w 0.1s";
}

Metoda HTTP

POST

z flagi -X/--request albo wywnioskowana: body → POST, inaczej GET

Nagłówki

2 szt.

z flagi -H/--header, plus wyliczone Authorization (z -u) i Content-Type (z --json)

Ciało żądania

29 B

treść z flagi -d/--data/--json, kodowana wg wybranego trybu body

Rozmiar wyniku

507 znaków

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);
})();
Wiersz liczony na serwerze tym samym konwerterem co wynik powyżej (kompaktowy zapis); w tabeli kod jest wypisany jako tekst, więc nic się nie wykonuje
Polecenie cURLMetodaWynik 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));
-X → method, -H → headers, -d → body (i domyślny POST), -u → Authorization: Basic; -L/--insecure i inne flagi sterujące są pomijane
Flaga cURLZnaczenieCo 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.

konwerter cURL na Fetch curl to fetch JS zamien curl na JavaScript fetch API konwerter

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"}'.

  1. 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.
  2. Konwerter dzieli tekst na tokeny. Adres https://api.example.com/users zostaje rozpoznany jako cel żądania, a kolejne pary flaga-wartość jako modyfikatory.
  3. 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.
  4. Obie flagi -H trafiają do jednego obiektu headers: Content-Type: application/json oraz Authorization o wartości Bearer TOKEN.
  5. Wartość po -d jest rozpoznawana jako JSON, więc zamiast surowego tekstu powstaje JSON.stringify z obiektem o polach name i role.
  6. 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 cURLOdpowiednik w FetchUwagi
Adres po flagachfetch(url)Pierwszy argument wywołania
-X POSTmethod: "POST"Brak flagi -X oznacza metodę GET
-d z danymi JSONbody: 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:passAuthorization: Basic + btoa(user:pass)Dane logowania nie trafiają do adresu URL
-b "cookie=val"Nagłówek Cookie lub credentials: includeWybór zależy od tego, kto zarządza ciasteczkami
Kilka flag -HJeden obiekt headersNazwy nagłówków są scalane, bez duplikatów
Brak -dBrak 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.

Zainstaluj Webp.pl Miej narzędzia we własnej kieszeni!