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";
}
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).
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.
Powiązane narzędzia: konwerter Fetch API na cURL, generator testowego JSON API i walidator JSON.