URL

JSON

URL을 JSON으로는 어떤 일을 하나요?

왼쪽에 URL을 붙여넣으면 오른쪽에 URL의 각 부분이 이름표가 붙은 JSON 객체로 나타납니다 — protocol, host, pathname, searchParams, hash까지 전부요. 한 번 보고 끝낼 용도가 아닙니다. 그 JSON을 그대로 살아갈 자리에 복사해 넣기 위한 도구입니다 — 설정 파일, Jest 픽스처, Postman 환경, YAML 매니페스트, 테스트용 요청 목업처럼요. URL 문자열은 타이핑은 쉬워도 검증하기는 까다롭고, 구조화된 객체는 그 반대입니다.

내부적으로는 모든 브라우저가 URL API를 통해 사용하는 것과 같은 알고리즘이며, 이는 WHATWG URL 표준의 구현체입니다. 쿼리 파라미터는 그 과정에서 디코딩됩니다 — %20은 공백, %5B는 [로 바뀌고, 반복되는 키는 JSON 배열로 묶입니다 — URLSearchParams의 동작과 동일합니다. 출력은 이 사이트의 다른 JSON 도구들이 사용하는 것과 같은 JSON.stringify 규칙으로 포맷됩니다.

URL의 부분들을 화면에서 살펴보고 싶을 뿐이라면 — 리다이렉트 디버깅, 트래커 체인 훑어보기 — URL Parser 페이지가 더 적합합니다. 두 페이지 모두 같은 변환을 수행하지만, 이 페이지는 JSON 자체가 보관할 산출물이 되는 경우를 위해 만들어졌습니다. 모두 브라우저 안에서만 처리되며 업로드도, 로그도 없습니다. 변환은 문법은 RFC 3986, JSON 출력은 RFC 8259를 따릅니다.

URL을 JSON으로 변환하는 방법

세 단계. 각 단계가 이 페이지의 버튼 하나에 대응합니다.

URL을 붙여넣거나 샘플 불러오기

왼쪽 패널에 URL을 넣으세요. 샘플을 누르면 퍼센트 인코딩, 반복 쿼리 키, 해시 프래그먼트가 들어 있는 실제 같은 이커머스 URL이 로드됩니다. 샘플:

https://api.shop.example.com/v1/orders?customer=Ava%20Chen&status=active&total%5Bgte%5D=49.99&page=2#summary

URL 생성자가 받아들이는 것은 무엇이든 동작합니다 — <code>http://</code>, <code>https://</code>, <code>file://</code>, <code>mailto:</code>, IPv6 호스트, 사용자 정보 포함.

JSON 출력 읽기

오른쪽 패널은 입력하는 동안 실시간으로 갱신됩니다. protocol, host, port, pathname, pathSegments(경로를 배열로 분할), searchParams(디코딩된 키-값 쌍, 반복 키는 배열), hash를 볼 수 있습니다. href 필드는 정규화된 URL의 표준형을 담고 있어 — 한쪽에 기본 포트나 끝 슬래시가 있어도 두 URL이 동등한지 검증할 때 유용합니다.

픽스처용으로 복사·다운로드·압축

복사를 누르면 JSON이 클립보드에 들어가고, 다운로드를 누르면 url.json으로 저장되며, 압축을 누르면 로그 한 줄이나 쿼리 파라미터에 쓰기 좋게 한 줄로 줄여줍니다. 입력 패널의 지우기는 두 에디터를 모두 초기화합니다.

실제로 이런 상황에서 씁니다

HTTP 요청 픽스처 만들기

테스트가 URL을 검증할 때 문자열로 비교하면 깨지기 쉽습니다 — 대소문자, 기본 포트, 끝 슬래시, 파라미터 순서가 모두 발목을 잡습니다. URL을 JSON으로 바꿔 객체를 픽스처에 넣고 필드 단위로 검증하세요. URL 형태로 매칭하는 Mock Service Worker나 Nock 같은 라이브러리와 자연스럽게 맞물립니다.

설정 파일에서 API 클라이언트 시드 데이터

베이스 URL을 단일 문자열로 저장하는 YAML/JSON 설정은 모든 소비자가 매번 다시 파싱하도록 강제합니다. 미리 분해된 형태(host, port, basePath, defaultParams)로 저장하면 설정 자체가 자기 설명적이 되고, "끝 슬래시 빠뜨렸나?" 류의 버그가 통째로 사라집니다. SDK 제너레이터와 OpenAPI 도구에 유용합니다.

OAuth와 웹훅 콜백 문서화

"콜백 URL은 이런 모양일 거예요"라고 설명하는 문서를 쓸 때, 원본 URL 옆에 JSON 분해 결과를 함께 두면 독자에게 훨씬 친절합니다. RFC 6749 같은 표준은 특정 쿼리 파라미터를 요구하는데, 구조화된 형태라면 "여기에 state가 보여야 합니다"가 한눈에 들어옵니다.

Postman / Bruno / HTTPie 환경 내보내기

대부분의 API 클라이언트는 내부적으로 URL을 분해된 객체로 보관합니다. 레거시 URL을 새 컬렉션에 가져오는 경우 — 예를 들어 엔드포인트를 평문 문자열로 나열하는 문서 사이트에서 마이그레이션할 때 — 먼저 JSON으로 바꿔두면 200개 엔드포인트를 손으로 일일이 클릭하는 대신 임포트를 스크립트로 처리할 수 있습니다.

자주 묻는 질문

URL Parser 페이지와는 뭐가 다른가요?

엔진은 같고 보여주는 방식이 다릅니다. URL Parser는 검사용입니다 — 긴 URL을 붙여넣고, 부분들을 살펴보고, 무엇이 잘못됐는지 결정한 뒤 탭을 닫는 흐름이죠. URL을 JSON으로는 결과를 다른 곳에서 쓰기 위한 페이지입니다 — 픽스처 파일, 설정, Postman 환경 같은 곳이요. JSON 출력은 동일하고, 페이지의 문구와 사용 사례가 "이걸 파일에 두고 싶다"는 워크플로우에 맞게 조정되어 있습니다.

왜 출력이 YAML이나 JS 객체 리터럴이 아니라 JSON인가요?

JSON은 최소 공통분모입니다 — 모든 언어, 모든 설정 시스템, 모든 테스트 프레임워크가 읽습니다. YAML이 필요하면 JSON을 JSON to YAML 도구에 통과시키세요. JS 객체 리터럴이 필요하다면 JSON은 이미 유효한 JS이니 .ts 파일에 그대로 붙이면 됩니다. 변환은 RFC 8259를 따르므로 JSON이 받아들여지는 곳이라면 어디서든 동작합니다.

반복되는 쿼리 키는 어떻게 표현되나요?

반복 키는 배열로 묶입니다. ?tag=red&tag=blue는 "tag": ["red", "blue"]가 됩니다. Express, FastAPI, ASP.NET, Spring 등 대부분의 프레임워크가 쿼리 문자열을 파싱하는 방식과 일치하며 URLSearchParams.getAll()이 반환하는 것과도 같습니다.

?items[]=1&items[]=2 같은 대괄호 표기 배열은 어떻게 되나요?

대괄호는 키의 일부로 그대로 보존됩니다 — 출력에 "items[]": ["1", "2"]로 보입니다. 네트워크상의 바이트를 충실하게 표현한 것이죠. 프레임워크(PHP, Rails, qs.js)에서 대괄호를 떼거나 중첩 객체로 펼쳐야 한다면, JSON에 대한 후처리 단계에서 처리하세요.

URL에 user:pass@host가 있으면 JSON에 비밀번호가 포함되나요?

네 — URL에 있다면 username과 password 필드가 출력에 나타납니다. 변환은 전부 브라우저 안에서만 실행되므로 자격 증명이 컴퓨터를 떠나는 일은 없습니다. 다만 자격 증명을 URL에 넣는 것 자체가 일반적으로 좋지 않은 방식이고(RFC 3986 §3.2.1 참조), JSON을 저장소에 커밋하기 전에 거의 확실히 제거하고 싶을 겁니다.

URL 여러 개를 한꺼번에 변환할 수 있나요?

이 페이지에서는 안 됩니다 — 한 세션에 한 URL을 변환합니다. 100개를 처리해야 한다면 이 페이지의 출력 구조를 작은 스크립트에 붙여 루프로 도는 게 가장 빠릅니다. 또는 직접 배치를 스크립트로 만든 뒤 JSON Formatter를 쓰셔도 됩니다. 일괄 변환을 UI 기능으로 제공하는 것은 로드맵에 있지만 아직 출시되지 않았습니다.

다른 URL & JSON 도구

변환은 그저 한 가지 작업일 뿐입니다. 자연스럽게 함께 쓸 수 있는 도구들은 다음과 같습니다: