JSON 포맷터 사용법 — 깨진 JSON 복구, 들여쓰기, 유효성 검사까지

서버에서 JSON을 받았는데 한 줄로 쫙 이어져서 도저히 구조가 안 보이는 상황. 혹은 따옴표 하나가 빠져서 Unexpected token 에러가 나는데 어디가 문제인지 모르겠는 순간. 이 글 하나면 해결됩니다.

온라인 JSON 포맷터를 검색하면 광고 가득한 사이트들이 나오지만, 대부분 들여쓰기만 해주는 수준입니다. 깨진 JSON 복구, 트리뷰 탐색, 민감한 데이터 안전 처리까지 한 번에 되는 도구를 찾기가 의외로 어렵습니다.

로그인 없이, 설치 없이, 브라우저 안에서 즉시 처리하세요.

JSON 파서 열기 →

JSON 포맷터가 필요한 순간

실무에서 JSON 포맷터를 꺼내는 전형적인 상황 3가지입니다.

1. API 응답이 한 줄로 압축돼 있을 때

서버 응답은 네트워크 비용을 아끼려고 공백 없이 보내는 경우가 많습니다.

{"user":{"id":42,"name":"홍길동","addresses":[{"city":"서울"},{"city":"부산"}]},"tokens":{"access":"eyJ..."}}

이걸 그대로 보면 구조가 보이지 않습니다. 포맷터에 붙여넣고 [Format] 버튼 한 번이면 끝납니다.

{
  "user": {
    "id": 42,
    "name": "홍길동",
    "addresses": [
      { "city": "서울" },
      { "city": "부산" }
    ]
  },
  "tokens": {
    "access": "eyJ..."
  }
}

2. JSON이 깨져서 파싱 에러가 날 때

Unexpected token · Unexpected end of JSON input 같은 에러는 대부분 다음 5가지 중 하나입니다.

  • 따옴표 누락 — 문자열 시작·끝 따옴표가 한쪽만 있거나 전부 없음
  • 쉼표 실수 — 마지막 요소 뒤에 쉼표가 붙어있음 (trailing comma)
  • 작은따옴표 사용 — JSON은 반드시 큰따옴표(")만 허용
  • 주석 — 표준 JSON은 //, /* */ 주석을 지원하지 않음
  • 키에 따옴표 없음{name: "홍길동"} ← 키도 큰따옴표로 감싸야 함

Lenient 모드가 있는 파서는 이런 실수를 받아서 복구해줍니다.

3. 깊은 계층에서 특정 값만 찾고 싶을 때

수백 줄짜리 JSON에서 user.addresses[1].city 같은 깊은 경로 하나만 필요한 경우, 트리뷰로 필요한 노드만 펼쳐보면 훨씬 빠릅니다.

iTool JSON 파서 사용법

/text/json-parser/ 열기 → 입력창에 JSON을 붙여넣으면 됩니다. 로그인 불필요.

핵심 기능 6가지

기능용도
Format보기 좋게 들여쓰기
Minify공백 제거해 한 줄로 압축
들여쓰기 선택2칸 / 4칸 / 탭
Lenient 모드깨진 JSON도 최대한 복구 (복구 부분 하이라이트)
트리뷰+/− 버튼으로 접었다 펼치기
복사·다운로드결과를 바로 붙여넣거나 .json 파일로 저장

샘플 JSON으로 테스트하기

기능이 궁금하다면 도구 페이지에서 [샘플] 버튼을 누르세요. 실제 API 응답과 유사한 샘플이 입력창에 채워지고, 포맷·Minify·트리뷰를 바로 시험해볼 수 있습니다.

자주 만나는 JSON 에러 5가지 — 복구 방법

브라우저·Node.js 버전에 따라 정확한 문구는 조금씩 다르지만, 유형은 아래 5가지에 대부분 들어맞습니다.

1. 마지막 쉼표 (trailing comma)

{
  "name": "홍길동",
  "age": 30,
}

마지막 "age": 30 뒤의 쉼표가 문제. JavaScript 객체 리터럴과 달리 JSON은 마지막 쉼표를 허용하지 않습니다. Lenient 모드에서는 자동 제거됩니다.

2. 작은따옴표

{'name': 'hong'}

JSON 표준은 큰따옴표만 허용합니다. Python dict 리터럴을 그대로 붙여넣을 때 흔한 실수.

{"name": "hong"}

3. None·True·False (파이썬 값 섞임)

파이썬·루비에서 복사해온 데이터에서 자주 나타납니다.

{"value": None, "active": True}

JSON은 null·true·false만 허용(모두 소문자). Lenient 모드는 None·True·False·undefined를 JSON 표준 값으로 자동 변환합니다.

4. 주석

{
  "debug": true, // 로컬에서만 true
  "port": 8080
}

JSON은 //·/* */ 주석을 지원하지 않습니다. VSCode 설정 파일에서 쓰는 JSONC(주석 허용 JSON) 규격을 쓰거나, Lenient 모드로 주석을 제거하세요.

5. 닫기 괄호 누락

{"items": [{"id": 1}, {"id": 2}

대괄호 ]와 중괄호 }가 닫히지 않았습니다. 긴 JSON에서는 눈으로 찾기 어려운데, 포맷터에 넣으면 어디서 끊겼는지 에러 위치가 바로 표시됩니다.

실무 팁 3가지

1. 민감한 JSON은 브라우저 내에서만 처리되는 도구를 쓰세요

API 키, 토큰, 개인정보가 포함된 JSON을 함부로 외부 사이트에 붙여넣으면 위험합니다. iTool JSON 파서는 100% 브라우저 JavaScript로 동작하며, 입력한 JSON 데이터는 서버로 전송되지 않습니다.

2. 팀 컨벤션에 맞는 들여쓰기 고정

  • JavaScript·TypeScript 생태계: 2칸이 기본 (Prettier 기본값)
  • Python·Go 커뮤니티: 4칸 선호
  • 레거시 시스템·Make 파일 연관:

프로젝트 포맷터 설정에 맞춰서 포맷팅한 뒤 커밋하면 git diff가 깨끗합니다.

3. API 요청 바디용은 Minify

Postman·curl의 --data에 JSON을 넣을 때는 한 줄이 편합니다. Minify로 압축하면 특수문자 이스케이프 실수를 줄일 수 있습니다.

관련 도구

JSON과 자주 함께 쓰이는 변환·파싱 도구들입니다.

자주 묻는 질문

Q. JSON 포맷터는 왜 필요한가요?
서버 API에서 받은 JSON은 보통 공백 없이 한 줄로 압축돼 있어 사람이 읽기 어렵습니다. 포맷터는 들여쓰기를 적용해 구조를 한눈에 파악할 수 있게 해주고, 유효성 검사로 쉼표·따옴표 누락 같은 실수를 잡아줍니다.

Q. JSON이 깨졌는데 복구할 수 있나요?
iTool JSON 파서의 Lenient 모드는 따옴표 누락, 마지막 쉼표(trailing comma), 주석 등 표준 JSON에서 허용하지 않는 문법도 받아서 최대한 복구합니다. 복구된 부분은 하이라이트로 표시됩니다.

Q. JSON 들여쓰기는 몇 칸이 표준인가요?
공식 표준은 없지만 실무에서는 2칸·4칸·탭 중 하나를 고정해서 씁니다. iTool 파서는 세 가지를 모두 지원합니다.

Q. JSON.stringify와 온라인 포맷터는 뭐가 다른가요?
JSON.stringify는 코드에서 쓸 때 편하지만 깨진 JSON은 파싱 단계에서 바로 예외가 납니다. 온라인 포맷터는 텍스트를 붙여넣고 즉시 결과를 확인할 수 있고, Lenient 모드까지 쓰면 잘못된 JSON도 구조 파악이 가능합니다.

Q. 민감한 JSON을 붙여넣어도 안전한가요?
iTool JSON 파서는 100% 브라우저 내에서 동작합니다. 입력한 JSON 데이터는 서버로 전송되지 않기 때문에 API 키·개인정보가 포함된 JSON도 외부로 유출되지 않습니다.

Q. JSON을 한 줄로 압축하려면 어떻게 하나요?
Minify 버튼을 누르면 모든 공백과 줄바꿈이 제거되어 한 줄로 압축됩니다.

Q. 트리뷰는 언제 쓰나요?
계층이 깊거나 배열이 많은 JSON에서 특정 경로의 값만 보고 싶을 때 유용합니다. +/− 버튼으로 노드를 접었다 펼칠 수 있습니다.


JSON 포맷터를 찾고 있었다면 iTool JSON 파서를 한 번 써보세요. 로그인 없이, 입력 JSON이 브라우저 밖으로 나가지 않고, 깨진 JSON까지 복구되는 Lenient 모드가 기본 탑재돼 있습니다.