JSON을 트리로 보는 방법
- JSON을 붙여넣거나, 파일을 끌어다 놓거나, URL에서 불러옵니다. 텍스트 옆에 트리가 나타납니다.
- 행을 클릭해 펼치거나 접고, 모두 펼치기와 모두 접기를 사용할 수도 있습니다. 키보드에서는 ↑, ↓로 이동하고 ←, →로 노드를 닫거나 엽니다.
- 검색 상자에 입력하면 일치하는 키와 값만 표시됩니다. 노드를 선택하면 JSONPath, JavaScript 경로 또는 값을 복사할 수 있습니다.
JSON 트리 읽는 법
- 객체에는
{5}처럼 키 개수가, 배열에는[12]처럼 항목 개수가 표시됩니다. - 색상과 작은 배지로 모든 값의 타입(문자열, 숫자, 불리언, null, 객체, 배열)을 보여 줍니다.
- 긴 배열은 한 번에 200개 항목씩 표시되므로 값이 수십만 개인 파일도 빠르게 반응합니다.
- 숫자는 입력한 그대로 표시됩니다. 긴 ID도 반올림되지 않으며 키는 원래 순서를 유지합니다.
JSONPath란?
JSONPath는 파일 경로처럼 JSON 문서 안에서 값이 어디에 있는지 나타냅니다. 2024년에 RFC 9535로 표준화되었습니다. $는 루트, .name은 속성, [0]은 배열 항목, ['first name']은 이름에 공백이나 특수 문자가 들어 있는 속성을 선택합니다.
| 경로 | 선택 대상 |
|---|---|
$.store | 루트 객체의 store 속성 |
$.products[0] | products 배열의 첫 번째 항목 |
$.products[0].price | 첫 번째 상품의 가격 |
$.address.geo.lat | 세 단계 깊이에 중첩된 값 |
$['shipping address'].city | 이름에 공백이 있는 키 |
JavaScript에서는 같은 값을 data.products[0].price로 나타냅니다. 이 형태가 필요하면 JS 경로 복사를 사용하세요.
자주 묻는 질문
큰 JSON 파일도 열 수 있나요?
네. 트리에서 펼친 부분만 그리고 긴 배열은 한 번에 200개 항목씩 표시하므로, 데스크톱 브라우저에서 수십 MB 크기의 파일도 열 수 있습니다.
값의 경로는 어떻게 복사하나요?
노드를 클릭한 뒤 JSONPath($.users[0].email)는 경로 복사, JavaScript 경로(data.users[0].email)는 JS 경로 복사를 사용하세요.
뷰어에서 JSON을 편집할 수 있나요?
뷰어는 읽기 전용이므로 실수로 내용이 바뀌지 않습니다. 값을 바꾸거나 키 이름을 변경하거나 항목을 추가하려면 JSON 편집기를 여세요.
JSON이 유효하지 않으면 어떻게 되나요?
오류 상자에 문제의 줄, 열, 원인이 표시되며, 오류가 수정될 때까지 트리는 마지막으로 유효했던 버전을 계속 보여 줍니다.