JSON 온라인 포맷 방법: 예제가 포함된 전체 가이드

다시 내 WP Adminify 일에,지원 티켓은 단순히 읽기 착륙: "Settings import broken. 아무것도 작동하지 않습니다." 사용자가 직접 내보낸 설정 파일을 편집했다 - 9,000 줄 JSON blob 의 217 줄에 하나의 후행 쉼표 - 그리고 내 수입업자는 world's 가장 도움이되지 않는 오류로 응답했습니다: 가져오기 실패.

나는 그 오류 메시지를 썼다. That's on me.

괜찮은 포맷터가 0.5초 안에 표시할 쉼표 하나를 찾는 데 우리 둘은 40분 정도 걸렸습니다. 그 티켓은 JSON 툴링에 대한 내 생각을 바꾸었고 몇 년 후 내가 어떻게 만들었는지 형성했습니다 JSON 포맷터 Toolz.dev 에: 오류 위치 isn't a nice-to-have. It's 전체 제품.

이 가이드는 JSON을 온라인으로 포맷하는 방법, 포맷이 실패하는 이유, 결국 내 오후를 포함하여 모두를 먹는 구문 트랩을 다룹니다.

TL;DR: JSON을 온라인으로 포맷하려면 다음과 같은 클라이언트 측 도구에 붙여넣으세요 Toolz.dev JSON 포맷터- 즉시 예쁜 인쇄를 하고,구문 오류에 줄 번호를 표시하며,데이터를 절대 업로드하지 않습니다. 서식 지정이 실패하면 거의 확실하게 후행 쉼표,작은 따옴표 또는 따옴표가 없는 키가 있습니다. 팀에서 달리 말하지 않는 한 2 공백 들여쓰기를 사용합니다.

What Does "JSON&quot 포맷하기; 실제로 한다?

체재 - 예쁜 인쇄,if you're feeling fancy - 들여쓰기와 줄 바꿈을 추가해서 구조가 보이게 됩니다. 데이터는 does't 가 한 비트씩 변경됩니다. It's 프레젠테이션 변환,더 이상은 없습니다.

이것:

{"employees":[{"firstName":"John","lastName":"Doe","department":"Engineering","skills":["JavaScript","Python","Docker"]},{"firstName":"Jane","lastName":"Smith","department":"Design","skills":["Figma","CSS","Illustration"]}],"company":"Acme Corp","founded":2015}

가 됩니다:

{
  "employees": [
    {
      "firstName": "John",
      "lastName": "Doe",
      "department": "Engineering",
      "skills": ["JavaScript", "Python", "Docker"]
    },
    {
      "firstName": "Jane",
      "lastName": "Smith",
      "department": "Design",
      "skills": ["Figma", "CSS", "Illustration"]
    }
  ],
  "company": "Acme Corp",
  "founded": 2015
}

동일한 데이터. 하지만 그 중 하나만 제인이 디자인에서 한눈에 볼 수 있습니다.

There's a bonus most people don't think about: 포맷팅은 또한 변장에서의 유효성 검사입니다. 포맷터는 문서를 다시 포맷하기 위해 구문 분석해야하므로 JSON 이 깨진 경우 좋은 포맷터가 알려줍니다 어디- 눈을 가늘게 뜨는 대신 하나를 사용하는 실제 이유입니다.

실제로 JSON 온라인 형식을 어떻게 지정합니까?

전체 작업 흐름은 약 15초입니다:

1. JSON을 복사합니다 그것이 사는 곳 어디에서나 - DevTools Network 탭 (요청을 마우스 오른쪽 버튼으로 클릭 → 응답 복사), curl 출력, 로그 파일, 동료's Slack 메시지.
2. 열다 JSON 포맷터. 가입도 없고 로그인도 없습니다. 로드되고 붙여넣기됩니다.
3. 출력을 읽습니다. 유효한 JSON 은 들여쓰기 및 구문 강조 표시로 다시 제공되며 큰 문서의 접이식 섹션이 있습니다. 잘못된 JSON 은 줄 번호와 일반 영어 설명으로 오류를 가져옵니다.
4. 복사 또는 다운로드. 어느 쪽이든 한 번의 클릭.

That's it. 재미있는 부분은 isn't 행복한 길 - it's 3 단계 일이 잘못될 때. 그래서 let's 는 잘못된다.

내 JSON이 포맷되지 않는 이유는 무엇입니까?

포맷터가 JSON을 거부하면 문서가 문법을 위반합니다 RFC 8259. 나의 경험에서 - 나의 자신의 벌레잡기에서 그리고 공구 사람들에서 건축에서 둘 다에 그들의 끊긴 JSON 를 안으로 풀칠하십시오 - it's 거의 항상 5 개의 것의 한.

1. 쉼표 뒤

{
  "name": "Alice",
  "age": 30,
}

SyntaxError: Unexpected token } in JSON at position 34

자바스크립트는 이것을 허용합니다. JSON 은 결코 가지고 있지 않습니다. 모든 객체와 배열에서 마지막 항목 뒤의 쉼표를 삭제하십시오:

{
  "name": "Alice",
  "age": 30
}

이것은 내 지원-티켓 쉼표입니다. 그것을 존중.

2. 작은 따옴표

{ 'name': 'Alice' }

고전적인 파이썬 텔. str(my_dict) 단일 인용 의사 JSON을 생성합니다; json.dumps(my_dict) 실물을 생산합니다. 만약 당신이're JSON 이라고 주장하는 무언가에 작은 따옴표를 보고,누군가가 그것을 직렬화 하는 대신 dict 를 인쇄 했습니다-I've 그것을 했다,you've 그것을 했다,we'll 모든 그것을 다시.

{ "name": "Alice" }

3. 탈출되지 않은 백슬래시

{ "path": "C:\new\test" }

무해해 보입니다. 하지만 \n 는 개행문자이며 \t 탭이므로 실제 줄이 끊어지는 경로로 구문 분석되거나 다음과 같은 시퀀스에서 완전히 실패합니다 \x. Windows 경로는 제 1 피해자이다:

{ "path": "C:\\new\\test" }

4. 일치하지 않는 괄호

{
  "users": [
    {"name": "Alice"},
    {"name": "Bob"}
}

실종된 ]. 여기 사소한, 깊은 여섯 레벨을 중첩 구성에서 잔인. 이것은 오류 인간의 범주는 진정으로 찾기 및 파서가 즉시 찾을 수 나쁜 - 아웃소싱.

5. aren't JSON 인 자바스크립트 값

{ "value": undefined, "count": NaN }

undefined, NaN, 그리고 Infinity JSON이 아닌 JavaScript입니다. JSON.stringify 조용히 개종합니다 NaN 에 null 그리고 떨어집니다 undefined 속성은 전적으로 - 이는 버그가 종종 json you're 에서 isn't 를 보고 있다는 것을 의미하고,it's 는 그것을 생산한 무엇이든지 간에 업스트림을 사용합니다 null 명시적으로 직렬화기를 확인하세요.

X-1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 포맷터 줄 번호가 붙은 다섯 개를 모두 잡습니다. 마지막 문장이 이 도구 카테고리가 존재하는 전체 이유입니다.

2 개의 공백, 4 개의 공백 또는 탭을 사용해야 합니까?

영원한 논쟁,JSON 판. Here's 정직한 비교:

내 위치, 그리고 I'll 이 작은 언덕에서 죽는다: 다른 코드가 사용하는 것과 상관없이 JSON 을 위한 2 개의 공백. JSON 은 일반적인 소스 코드보다 더 깊게 중첩됩니다 - API 응답 4 단계와 5 단계 깊이는 정상입니다 - 그리고 4 공간 들여쓰기는 수평 스크롤 연습으로 바꿉니다. 파이썬이 많은 팀에서도 JSON 을 2 칸으로 설정했는데 아무도 두 번 불평하지 않았습니다.

무엇을 선택하든 토론이 끝나도록 인코딩하세요:

# .editorconfig
[*.json]
indent_style = space
indent_size = 2
insert_final_newline = true

X-1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 포맷터 두 너비를 모두 지원하므로 project's 규칙을 일치시키는 것은 토론이 아니라 드롭다운입니다.

명령줄에서 포맷하는 것은 어떻습니까?

가끔 단말기가 브라우저 탭보다 더 가까울 때가 있습니다. 나의 실제 사용량:

# jq — the standard. Install it, learn 10% of it, profit.
curl -s https://api.example.com/users | jq .

# Python — already on basically every machine
curl -s https://api.example.com/users | python -m json.tool

# Node, if you enjoy typing
node -e "console.log(JSON.stringify(JSON.parse(require('fs').readFileSync(0,'utf8')),null,2))" < data.json

각자가 승리하는 곳: 솔직히

• jq 스크립트, 반복 또는 파이프로 작성된 모든 항목 및 필드 추출용(jq '.data.users[].email') 전체 문서를 읽는 것보다.
• 브라우저 도구는 일회성을 위해, 원하는 모든 것을 위해 탐험하기 접을 수 있는 섹션과 팀원을 표시하려면 프로젝트 관리자에게 jq 표현식을 화면 공유하면 됩니다.
• VS 코드 (Shift+Alt+F) repo에 있고 어쨌든 열려 있는 JSON 파일의 경우입니다.

매일 세 개 다 써요. 하나는 다른 걸 대신한다고 말하는 사람은 뭔가를 파는 거예요.

훔칠 가치가 있는 습관 하나: curl -s ... > response.json 첫번째을 한 다음 파일을 포맷합니다. 응답이 a 를 착용한 HTML 오류 페이지로 판명되면 Content-Type: application/json 의상 - 우리 중 누구라도 원하는 것보다 더 많은 일이 발생합니다. you'll은 브라우저가 아닌 원래 바이트를 원합니다's 해석.

대부분의 사람들은 세 가지 포맷 기술을 건너뜁니다

키를 알파벳순으로 정렬합니다. 다른 직렬화기는 다른 순서로 키를 방출하는데,이는 "same"의 diffs 를 다시 쓰는 것처럼 보이게 합니다. diff 하기 전에 키를 정렬하면 300 줄의 diff 가 실제로 변경된 2 줄로 바뀝니다. 이것은 the 와 아름답게 짝을 이룹니다 텍스트 차이 도구 스테이징과 프로덕션 페이로드를 비교할 때 - 적어도 두 번의 사건 동안 개인적으로 나를 구해준 트릭입니다.

짧은 배열을 인라인으로 유지합니다. "colors": ["red", "green", "blue"] 한 줄에 의식의 다섯 줄보다 더 잘 읽습니다. 좋은 포맷터는 기본 요소의 배열에 대해 자동으로이 작업을 수행합니다; it's 당신이 훑어 및 형식 JSON that's 의 차이 기술적으로 예쁜하지만 4,000 줄 길이.

파일이 아닌 조각의 형식을 지정합니다. 15 MB 문서의 경우 하나의 개체만 신경쓰는 경우: 해당 중첩 개체를 복사하고, 혼자 포맷하고, 완료합니다. 전체 파일을 40줄 읽을 수 있도록 포맷하는 것은 헛된 노력입니다. 하지만 전체 작업이 필요한 경우 클라이언트 측 도구는 업로드 진행률 표시줄 없이 처리합니다. there's 업로드가 없기 때문입니다.

그리고 언제인지 알아라 아닙니다 포맷하려면: 프로덕션 번들의 minified JSON 및 API 응답은 minified 상태를 유지해야 합니다. 포맷은 와이어가 아닌 눈을 위한 것입니다. 반대 방향이 필요한 경우에도 마찬가지입니다 도구 한 번의 클릭으로 축소합니다.

자주 묻는 질문

JSON을 온라인으로 무료로 포맷하려면 어떻게해야합니까?

JSON을 붙여넣으세요 Toolz.dev JSON 포맷터- 그것은 구문 강조와 오류 검사,무료, 가입없이 즉시 포맷. 처리는 브라우저에서 발생하므로 아무 것도 붙여 넣기 아무 것도 아무데도 업로드되지 않습니다. 그 마지막 부분은 "free" 페이로드가 토큰이나 사용자 데이터를 포함하는 경우 부분.

JSON이 올바르게 포맷되지 않는 이유는 무엇입니까?

문서에는 구문 오류가 있으며,가장 높은 용의자는 후행 쉼표,작은 따옴표,인용되지 않은 키,탈출되지 않은 백슬래시 및 일치하지 않는 괄호입니다. 유효성을 검사하는 포맷터는 정확한 줄을 가리킵니다. 오류가 의미가 없으면 실제로 JSON 이 있는지 확인하십시오 - API 는 JSON 콘텐츠 유형으로 HTML 오류 페이지를 반환하는 것을 좋아합니다.

What's 포맷과 JSON 유효성 검사의 차이점?

포맷은 가독성을 위해 공백을 다시 씁니다; 유효성 검사는 RFC 8259 문법에 대해 문서를 검사합니다. 실제로 they're 는 동일한 작업입니다 - 포맷터는 다시 포맷하기 전에 구문 분석 (검증) 해야 합니다. That's why "it won't format" and "it's invalid"는 동일한 진단입니다.

JSON 들여쓰기에 2 칸 또는 4 칸을 사용해야 하나요?

프로젝트가 이미 4 에서 표준화되지 않은 경우 2 공백을 사용합니다. JSON 은 대부분의 소스 코드보다 더 깊게 중첩되며 2 공백 들여쓰기는 수평 스크롤 없이도 실제 API 응답을 읽을 수 있도록 유지합니다. 그런 다음 선택 항목을 잠급니다 .editorconfig 그래서 다시는 코드 리뷰에 나오지 않습니다.

확장자 없이 VS 코드에서 JSON을 포맷할 수 있습니까?

예 - Shift+Alt+F (또는 Shift+Option+F mac 에서) 는 내장된 포맷터로 모든 JSON 파일을 포맷하고, "Save&quot 에서 포맷;을 자동으로 만듭니다. 참고 VS Code's 자신의 settings.json 는 JSONC, 이는 코멘트를 허용 - don't는 당신이 일반 JSON 않습니다 설득하자.

온라인 JSON 포맷터에 API 응답을 붙여 넣는 것이 안전합니까?

클라이언트 측에만. 포맷터 사이트의 많음은 서버에 입력을 게시,이는 API 응답을 의미 - 토큰,이메일, 그 모든 - 지금 다른 사람에 존재's 로그. 그만큼 Toolz.dev 포맷터 브라우저에서 완전히 실행됩니다; 붙여넣는 동안 네트워크 탭을 보고 직접 확인하세요.

거대한 JSON 파일 (10 MB +) 을 포맷하려면 어떻게해야합니까?

클라이언트 측 브라우저 도구는 there's 아무 업로드 단계 이후이 범위 벌금에 파일을 처리 - 붙여 넣기는 느린 부분입니다. 과거 50 MB 정도,스트리밍 도구로 전환: jq 명령줄에서,또는 당신이 필요로 하는 단면도를 다만 추출하고 저것을 체재하십시오. 서버 근거한 공구에 거대한 파일을 결코 풀칠하지 말라; you're 는 아무 이득도 위한 올려주기에 기다리고 있다.

JSON 을 포맷하는 대신 어떻게 축소합니까?

동일한 도구, 반대쪽 버튼 - JSON 포맷터 모든 공백을 제거하는 원클릭 minify 모드가 있습니다. 프로덕션 페이로드,localStorage 및 로그 파이프라인에 대해 Minify; 인간을 위한 형식입니다. 데이터는 어느 쪽이든 동일합니다.

JSON을 포맷하면 데이터가 변경됩니까?

아니요 - 서식 지정은 공백만 다시 작성하므로 키,값 및 구조는 의미가 동일하게 유지됩니다. 서식이 지정된 문서와 축소된 버전은 정확히 동일한 개체로 구문 분석됩니다. 데이터가 실제로 변경되는 경우 서식 지정이 아닌 손으로 무언가를 편집했습니다.

JSON 미용사 란 무엇입니까?

It's json 포맷터의 다른 이름 - 축소되거나 지저분한 JSON 을 가져와 들여쓰기 및 줄 바꿈을 추가하여 인간이 읽을 수 있도록 하는 도구입니다. "Beautify," "pretty-print," and "format" 모두 동일한 작업을 설명합니다. The JSON 포맷터 한 페이스트에 합니다.

15초 습관

JSON 을 포맷하는 것은 큰 수익률을 가진 작은 기술입니다 - 대부분의 "the API is broken" moments are really "the payload is unreadable" moments,and those dissolve the second the structure becomes visible.15 초까지 붙여넣기-형식-읽기 루프를 가져오면 디버깅 마찰의 전체 범주가 사라집니다.

X-1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X Toolz.dev의 JSON 포맷터 해당 지원 티켓 중에 원했던 이 도구의 버전입니다: 즉각적이고, 오류에 대해 정확하며, 데이터를 수신하지 못하기 때문에 데이터를 유출할 수 없습니다.

JSON이 깨끗해지면 다음 단계는 일반적으로 JSON을 스프레드시트로 이동하는 것입니다 JSON에서 CSV로 변환기, 하나에서 다시 CSV를 JSON으로 변환합니다또는 다음을 통해 구성 파이프라인으로 들어갑니다 야엘 검증인. 다음으로 시작하세요 JSON-CSV 가이드 아니면 다시 위로 가세요 JSON 도구 가이드 완료 전체 맵을 위해.

관련 기사:

• JSON 도구에 대한 최종 가이드(2026)
• JSON에서 CSV로의 전환: 개발자가 2026년에 사용하는 5가지 방법
• 무료 온라인 텍스트 도구 가이드