Как посмотреть 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 элементов, поэтому файлы размером в десятки мегабайт открываются в десктопном браузере.
Как скопировать путь к значению?
Щёлкните по узлу, а затем нажмите Копировать путь, чтобы получить JSONPath ($.users[0].email), или Копировать JS-путь — для JavaScript (data.users[0].email).
Можно ли редактировать JSON в просмотрщике?
Просмотрщик работает только на чтение, поэтому ничего не изменится случайно. Чтобы менять значения, переименовывать ключи или добавлять элементы, откройте JSON редактор.
Что будет, если мой JSON невалиден?
В блоке ошибки появятся строка, столбец и причина проблемы, а дерево продолжит показывать последнюю валидную версию, пока ошибка не будет исправлена.