Безкоштовний конвертер

Дерево JSON Переглядач

Переглядайте, форматуйте та досліджуйте дані JSON в інтерактивному дереві, що згортається. Безкоштовно, безпечно та не потребує завантаження.

Перетягніть файл JSON сюди

Або вставте текст JSON нижче

Або

Про цей інструмент

Засоби перегляду дерева JSON відображають дані JSON як ієрархічне дерево з можливістю навігації, а не як звичайний текст. Кожен предмет стає розбірною гілкою; масиви показують свої елементи окремо; примітивні цінності постають у вигляді листя. Структурне подання дозволяє легко знаходити певні поля в глибоко вкладених даних, згортати нерелевантні піддерева та переміщатися по великих документах JSON, якими було б неможливо керувати як плоский текст.

Порівняно з відформатованим текстом JSON, деревоподібні представлення перевершують навігацію у великих даних. Відповідь API розміром 10 МБ непрактично прокручувати як текст, але її можна прокрутити як дерево, де ви згортаєте ключі верхнього рівня, які вас не цікавлять, і розгортаєте лише ті частини, які вас цікавлять.

Цей засіб перегляду відображає JSON у структурованому дереві у вашому браузері. Пошук фільтрує гілки за ключем або значенням. Відображення з урахуванням типу розрізняє рядки, числа, логічні значення, значення null, об’єкти та масиви.

Навіщо використовувати JSON Tree Viewer

Глибоко вкладені дані важко орієнтуватися як текст. Файли конфігурації, відповіді API та серіалізований стан часто мають 5+ рівнів вкладеності. У вигляді дерева можна згортати нерелевантні рівні та зосереджуватися на важливому; перегляди тексту вимагають ретельного прокручування та підрахунку дужок.

Можливості пошуку та фільтрації також мають значення. Знайти всі ключі з іменем 'user_id' у складному документі можна швидко за допомогою засобу перегляду з підтримкою пошуку; неможливо зробити надійно з простим текстом.

Як використовувати

Вставте JSON, перейдіть по дереву.

  1. Вставте свій JSON: Перемістіть JSON у область введення. Переглядач аналізує та відтворює структуроване дерево.
  2. Розгорнути та згорнути: Натисніть гілки, щоб розгорнути або згорнути. Корисно для зосередження на конкретних піддеревах великих даних.
  3. Пошук: Фільтрувати за ключем або значенням. Відповідні гілки залишаються видимими; невідповідні приховані.
  4. Перевірте конкретні значення: Клацніть аркуш, щоб побачити його повне значення (корисно для довгих рядків), і скопіюйте шлях (наприклад, users.0.profile.email) для використання в коді.

Загальні випадки використання

Технічні деталі

Синтаксичний аналіз JSON використовує JSON.parse, який завершується помилкою в разі неправильного введення з помилкою аналізу, яка вказує на місце проблеми. Дійсний JSON рендериться в об’єкт JavaScript, за яким програма перегляду рекурсивно створює дерево.

Візуалізація: кожен рівень вкладеності стає гілкою з відступом. Ключі об'єктів - це мітки; значення відображаються на основі типу — рядки в лапках, числа без, логічні значення як true/false, null явно, об’єкти та масиви як гілки, що згортаються.

Продуктивність: дуже великий файл JSON (10 МБ+) може сповільнити рендеринг. Допомагає відкладене розширення (відтворення лише видимих ​​на даний момент гілок). Пошук у великих документах може зайняти помітний час; допомагає індексація дерева під час першого аналізу.

Найкращі практики

Поширені запитання

Наскільки глибоким може бути дерево JSON?
Немає штучного обмеження глибини. Інструмент відтворює дерева настільки глибоко, наскільки сягає ваша структура JSON. Однак надзвичайно глибока вкладеність (100+ рівнів) може уповільнити рендеринг у браузері.
Чи можу я шукати в дереві JSON?
Використовуйте Ctrl/Cmd+F для пошуку ключів або значень. Відповідні вузли будуть виділені, а їхні батьківські вузли автоматично розгорнуті, щоб показати шлях.
Який формат шляху JSON використовується?
Інструмент використовує точкову нотацію JSONPath ($.key.nested.array[0].value). Цей формат сумісний із доступом до властивостей JavaScript і більшістю бібліотек JSONPath.
Чи можу я редагувати значення в дереві?
Це засіб перегляду лише для читання для дослідження. Для редагування JSON скористайтеся нашим інструментом JSON Formatter, який надає редагований інтерфейс із перевіркою.
Мої дані завантажено?
Ні. Розбір і рендеринг відбуваються у вашому браузері.
Як мені експортувати частину дерева?
Більшість засобів перегляду пропонують копіювати як JSON для вибраних гілок. Експортоване значення має ту саму структуру лише з вибраними ключами.
Чому дерево працює повільно з великими даними?
DOM-рендеринг багатьох вузлів є дорогим. Ледаче розгортання (виведення лише видимих ​​гілок) допомагає; для дуже великих даних спеціальні інструменти (jq, код) більш ефективні.
Чи можу я переглядати JSON за URL-адресою?
Деякі програми перегляду отримують URL-адреси безпосередньо. Інші вимагають обклеювання. CORS може запобігти перехресному отриманню з деяких URL-адрес.