LocalTools오프라인 브라우저 도구 모음

분류: 개발 도구

cURL to fetch() 변환기

자체 기획 도구찾는 도구가 없나요?

curl 명령어를 JavaScript fetch() 호출로 변환

브라우저 네트워크 탭에서 복사했거나 API 문서에서 가져온 curl 명령어를 붙여넣으면 메서드, 헤더, 본문을 그대로 옮긴 동등한 JavaScript fetch() 호출이 만들어집니다. 변환은 모두 브라우저에서 이루어집니다.

fetch() 코드
fetch("https://api.example.com/v1/items", {
  method: "POST",
  headers: {
    "Content-Type": "application/json"
  },
  body: "{\"name\":\"Ada\"}"
})
  .then((response) => response.json())
  .then((data) => console.log(data));

이 페이지의 모든 처리는 브라우저에서 이루어집니다. 업로드는 없습니다.

이 도구로 할 수 있는 일

API 문서와 브라우저의 "copy as curl" 메뉴는 모두 curl 명령어를 만들어 내지만, 프런트엔드에서는 보통 같은 요청을 fetch()로 옮겨야 합니다. 이 도구는 -X/--request, -H/--header, -d/--data(및 --data-raw, --data-binary, --data-urlencode 변형), --url, -u/--user, 그리고 뒤에 붙은 단독 URL을 해석하며, 여러 개의 단독 인자나 지원하지 않는 플래그처럼 인식하지 못하는 형태에는 잘못된 추측 대신 명확한 오류를 보여 줍니다.

사용 방법

  1. curl 명령어를 붙여넣습니다.
  2. 생성된 fetch() 코드를 확인합니다.
  3. JavaScript 코드에 복사해 넣습니다.

개인정보

이 도구는 전부 브라우저 안에서 동작합니다. 입력한 내용은 업로드되거나 저장되거나 공유되지 않으며, 탭을 닫으면 사라집니다.

자주 묻는 질문

요청이 어딘가로 전송되나요?
아니요. 명령어는 텍스트로 파싱되고 다시 작성될 뿐이며, 실행되지 않습니다.
어떤 curl 플래그를 지원하나요?
-X/--request, -H/--header, -d/--data(및 --data-raw, --data-binary, --data-urlencode), --url, Basic 인증용 -u/--user, 그리고 -s, -L, -k, -i 같은 인자 없는 일반 플래그는 안전하게 무시됩니다. 그 외의 플래그는 조용히 무시하는 대신 지원되지 않는 플래그로 보고됩니다.
왜 가끔 Content-Type 헤더가 추가되나요?
명령어에 본문은 있지만 명시적인 Content-Type 헤더가 없으면, JSON API에 대한 curl 자체의 일반적인 기본값에 맞춰 application/json이 추가됩니다. 요청에 다른 타입이 필요하면 수정하거나 삭제하세요.

전체 도구로 돌아가기