Как пользоваться: JSON форматтер
- Вставьте JSON в поле Input JSON, перетащите на него файл
.jsonили нажмите Load sample. - Результат обновляется по мере ввода. Выберите Beautify с отступами 2 пробела, 4 пробела или табуляцией, либо Minify, чтобы удалить все пробельные символы.
- Если JSON некорректен, ошибка будет показана с номером строки и столбца. Нажмите Jump to error, чтобы выделить нужный символ во входных данных.
- Перейдите на вкладку Tree, чтобы изучить вложенные данные. Нажмите на любое значение, чтобы скопировать его путь (например,
$.variants[0].color). - Нажмите Copy или Download, чтобы сохранить результат.
Что такое JSON форматтер?
JSON форматтер (также называемый JSON beautifier или pretty-printer) принимает компактный или неаккуратный JSON и переписывает его с единообразными отступами и переносами строк, чтобы его было удобно читать. API обычно возвращают минифицированный JSON в одну строку, чтобы сэкономить байты. Форматирование — первый шаг, когда вы отлаживаете ответ, проверяете конфигурационный файл или пишете документацию. Этот инструмент работает и в обратную сторону: Minify удаляет все лишние пробелы и переводы строк, чтобы получить минимальный размер данных.
Форматирование и валидация идут рука об руку. Форматтер разбирает ваши данные по тем же строгим правилам, что и JSON.parse(), поэтому всё, что он принимает, будет принято любым парсером, соответствующим стандарту (RFC 8259).
Частые ошибки в JSON и как их исправить
Если разбор не удался, валидатор показывает точную строку и столбец, выделяет символ и объясняет проблему. Вот ошибки, которые он находит чаще всего:
| Ошибка | Неверно | Верно |
|---|---|---|
| Лишняя запятая в конце | [1, 2, 3,] | [1, 2, 3] |
| Одинарные кавычки | {'id': 1} | {"id": 1} |
| Ключ без кавычек | {id: 1} | {"id": 1} |
| Комментарии | {"a": 1 // note} | Удалите комментарий |
| Пропущенная запятая | {"a": 1 "b": 2} | {"a": 1, "b": 2} |
| Специальные числа | NaN, Infinity, 01 | null, 1 |
| Перенос строки внутри строки | "строка 1⏎строка 2" | "строка 1\nстрока 2" |
Многое из этого допустимо в литералах объектов JavaScript, в JSON5 или YAML, но не в JSON. Это частая причина путаницы при копировании данных из исходного кода.
Предупреждения помимо синтаксиса
Некоторый JSON формально корректен, но всё же рискован. Валидатор предупреждает о повторяющихся ключах (большинство парсеров молча оставляют только последнее значение) и о целых числах больше 253 (9 007 199 254 740 991), которые JavaScript не может представить точно. Это частая проблема с 64-битными ID из баз данных. Если вы видите такое предупреждение, передавайте такие ID как строки.
Beautify или minify: что выбрать?
Отформатированный JSON используйте для всего, что читают люди: конфигурационных файлов в Git (чтобы различия были построчными), документации и отладки. Отступ в два пробела — самое распространённое соглашение в JavaScript-проектах, четыре пробела характерны для json.dumps(indent=4) в Python. Минифицированный JSON подходит для передачи по сети и хранения. Учтите, что сжатие gzip или Brotli на сервере уже убирает большую часть разницы в размере, поэтому для файлов, которые вы коммитите, важнее читаемость.
Режим дерева и сортировка ключей
Для больших документов режим Tree позволяет сворачивать объекты и массивы и сразу видеть количество элементов. Sort keys упорядочивает ключи всех объектов по алфавиту на всех уровнях. Это удобно для сравнения двух JSON-документов в Diff Checker, поскольку порядок ключей иначе создаёт лишние различия. Нужен другой формат? Преобразуйте в YAML, CSV или типы TypeScript.
Также ищут как: json beautifier, json lint.
Инструменты, которые хорошо сочетаются с JSON форматтер
- JavaScript форматтер — Распакуйте и отформатируйте JavaScript, JSON или JSX с нужными отступами и стилем скобок.
- Base64 кодер / декодер — Преобразуйте текст в Base64 и обратно с полной поддержкой UTF-8 (акценты, эмодзи), включите URL-safe Base64 или перетащите файл, чтобы получить его строку Base64 или data URI.
- Валидатор JSON Schema — Вставьте схему и JSON, чтобы увидеть, какие значения нарушают какие правила, или сгенерируйте стартовую схему по примеру данных.
- Тестер JSONPath — Введите запрос JSONPath и сразу увидите, что он выбирает, с точным путём каждого совпадения.
Часто задаваемые вопросы
Загружается ли мой JSON на сервер?
Почему валидатор не принимает комментарии и запятые в конце?
tsconfig.json) и YAML, их поддерживают, но строгий парсер вроде JSON.parse() выдаст ошибку.Какой размер файла можно отформатировать?
Меняет ли форматирование мои данные?
В чём разница между JSON и объектом JavaScript?
undefined, комментарии и запятые в конце не допускаются.